사이트 관리 담당자가 되서... 수정을 해야하는데 도움좀 받을수 있을까요...

사이트 관리 담당자가 되서... 수정을 해야하는데 도움좀 받을수 있을까요...

QA

사이트 관리 담당자가 되서... 수정을 해야하는데 도움좀 받을수 있을까요...

본문

갑자기 사이트 관리 담당이 되서... 수정을 해야 하는데 도데체 저기에 해당하는 내용을 못찾겠어서요.

CSS에 있는 클래스로 전체 파일을 검색해서 찾았는데 메인리스트 클래스로 묶여있는 태그가

html로 작성된게 아니라 php 와 js 로 되어 있는데 html 코드 없이 php 와 js 로도 화면구성이 가능한가요?

전 여태 html로 화면구성 하고 그 다음 js로 꾸며주고 php로 서버와 연동하는줄 알았는데....

만약 php 나 js 로 화면구성이 가능하다면 저 CSS에 있는 li나 ul 태그 안의

내용의 위치를 변경해야 할 때 찾는 방법이 있을까요...

 

CSS코드

.main-list {width:100%; margin-bottom:50px;}
.main-list > div {width:1200px; margin:0 auto;}
.main-list > div > ul {width:100%; margin-top:20px; overflow:hidden;}
.main-list > div > ul > li {float:left; width:23%; margin:1%; padding:10px 10px 0px 10px; text-align:center; border:#C1C1C1 1px solid;}
.main-list > div > ul > li > ul {width:95%; margin:10px 0 15px 0; height:53px; overflow:hidden;}
.main-list > div > ul > li > ul li:nth-child(1) {float:left; width:29.3%; }
.main-list > div > ul > li > ul li:nth-child(2) {float:left; width:29.3%; padding:17px 15px 17px 0; font-size:14px; font-weight:bold; color:#fff; background:url('/main/img/circle_b53_bg.jpg') no-repeat;}
.main-list > div > ul > li > ul li:nth-child(3) {float:left; width:29.3%; padding:17px 15px 17px 0; font-size:14px; font-weight:bold; color:#fff; text-align:center; background:url('/main/img/circle_g53_bg.jpg') no-repeat;}
.main-list > div > ul > li > div {transition:0.7s; cursor:pointer;}
.main-list > div > ul > li > div:hover {opacity:0.4;}
.main-list > div > ul > li > div h1 {font-size:18px; font-weight:bold; color:#333; letter-spacing:-1px;}
.main-list > div > ul > li > div h3 {margin-top:5px; font-size:16px; font-weight:bold; line-height:16px; color:#999; text-decoration:line-through;}
.main-list > div > ul > li > div h4 {margin-top:10px; font-size:30px; font-weight:bold; line-height:30px; color:#ea002c;}
.main-list > div > ul > li > div h4 span {font-weight:normal; font-size:20px; font-weight:bold; line-height:30px;}
.main-list > div > ul > li > div div {margin:0 0 10px 0;}
.main-list > div > ul > li > div div a {display:block; padding:15px 10px; font-size:16px; font-weight:bold; border-radius:10px; color:#fff; line-height:14px; letter-spacing:-1px; background-color:#0000FF;}
.main-list .main-list-btn {text-align:center; margin-top:10px;}
.main-list .main-list-btn a{display:inline-block; width:120px; height:40px; line-height:40px; font-size:14px; font-weight:700; color:#fff; background:#222; border-radius:20px;}
.main-list .main-list-btn a:hover{background-color:#fc3e4d;}

이 질문에 댓글 쓰기 :

답변 7

보통 css 선택자는 아래 방법으로 찾고

https://homzzang.com/b/css-251

 

그외 코드는

에디트플러스 같은 유틸의 여러파일찾기 기능 이용해 찾습니다.

이게 사이트에서 복사해서 올린게 아니라 에디터로 열어서 확인한 태그를 복사해서 올린거라서요....... 이피 파일은 에디터에서 찾아봤는데 htrml 태그가 안보여서 질문드린거예요.....

style 는 html 문서의 꾸미기를 위한 태그이며 js 는 scrirpt 임으로 html페이지를 제어 합니다.

님이 이것을 하려면 공부를 좀 하셔야 합니다.

네 제가 그래서 설명에도 써놨듯이 html로 CSS에 있는 태그들이 있어야 하는데 태그가 없어서 질문 드린거예요..... 사이트에서 복사한게 아니라 에디터에서 파일 열어서 찾아서 올린거예요.,..

저 CSS에 해당하는 HTML 코드 부분을 찾고 싶다는 말씀인가요?

네 찾으려고 해봤는데 파일 내에서 클래스이름 이나 저기에서 사용된 태그로 검색을 했는데 에디터에서 안나와서요... 에디터는 Atom을 쓰고 있어요 아톰 내에서 전체 파일 검색하는 기능으로 검색 했는데 html로 작성된게 안보여서요...
보통 클래스명으로 찾으면 다 나왔었는데 저 부분에 해당하는걸 못찾겠네요....

코드 찾는 방법 3가지 입니다.

 

1. 에디터 플러스 여러파일찾기해서 찾습니다.  ( 초보도 할수 있는 간편한 방법 )

 

일단 자신이 쓰는 윈도우에 코드파일들을 다 다운받습니다.

코드파일들을 다운 받은 위치를 아래 스크린샷의 폴더(O) 에 입력하면 됩니다.

 

1794657427_1576202966.8947.png

 

찾을말 + 파일 종류 + 폴더 + 하위 폴더 포함 체크

 

파일 종류는 뒤로 확장자를 잘 두시면 됩니다.

php 파일이면 *.php

html 파일이면 *.html

css 파일이면 *.css

js 파일이면 *.js

모든파일이면 *.*

 

다 했으면 찾기 버튼 눌러서 해당 코드를 찾습니다.

 

 

2. 크롬 개발자도구 또는 파이어폭스 개발자 도구 를 이용해서 찾을수 있습니다.

 

크롬 브라우저에서 찾고 싶은 엘리먼트를 마우스 우 클릭해서 검사를 클릭합니다.

 

1794657427_1576203392.4826.png

 

그러면 매우 친절하게 크롬개발자도구에서 해당 css 파일이 어디있는지 알려줍니다.

 

1794657427_1576203486.3541.png

 

3. 리눅스를 다룰줄 아는 개발자라면 서버에서 grep 명령어로 찾는다. ( 난이도 있음 )

 

구글에서 리눅스 grep 이라고 검색하거나 아래 URL 참고

 

https://recipes4dev.tistory.com/157

음...... 제가 CSS 파일의 위치를 찾고 싶다고 올린게 아니라... 제가 질문을 잘못 올렸나봐요 ㅠㅠ 흐엉.
에이터는 아톰을 쓰는데 아톰에서도 서치인폴더 기능으로 찾을수 있어서 찾아봤는데
저 CSS에서 클래스명 메인리스트로 작성된 html태그가 있을거라 생각하고 html 태그를 찾으려고 했던건데

<div id="mlist0" class="main-list">
<div>
<ul class="mt0">
<?
$sql = "select * from ".$g5['product_phone_table']." where (1) ";
if ($ca_id2 != "all" && $ca_id2) {
$sql .= " and t_idx = '".$ca_id2."'";
}
if ($ca_id3 != "all" && $ca_id3) {
$sql .= " and m_idx = '".$ca_id3."'";
}

이런식으로 클래스명이 메인리스트 인데 아래 php로 이뤄져 있어서 질문 드린거예요...
결론적으론 html태그를 찾고 싶은 거예요.......
혹시나 php나 js 로 화면구성이 가능할수도 있을까봐 그것도 문의 드린거구요...

아..... sinbi님 정말 감사합니다. ㅜㅜ

드뎌 하나는 찾았네요..... 그런데 sinbi님 말처럼 php안에서 작성된거라 제가 건들수가 없어요....

전 html 코드만 바꿀려고 했던건데..... 어느분이 만들었는지 모르지만 이런걸.... 저에게 관리를 하라고 맡기다니...... 원망스럽네요... 이건 배운다고 바로 고칠수 있는게 아닌것 같은데...

 

다시 한번 감사드려요. 일단 얘기드려봐야겠네요.

제가 질문을 잘못 올린것 같아요......

저는 에디터에서 CSS에 적혀있는 저 내용에 대한 html 태그를 찾고 싶은거였는데....

html태그가 아무리 찾아봐도 안보여서 php 나 js로 화면 구성이 되는지까지 물어본건데....

질문을 너무 두서없이 했나봐요....

 

간단하게 에디터에서 html태그를 찾고 싶은데 방법이 없나요?

이거예요. 참고로 아톰 에디터에도 파일 내의 내용검색기능이 있어서 클래스명으로 찾았더니

<div id="mlist0" class="main-list">
        <div>
            <ul class="mt0">
                <?
                $sql = "select * from ".$g5['product_phone_table']." where (1) ";
                if ($ca_id2 != "all" && $ca_id2) {
                    $sql .= " and t_idx = '".$ca_id2."'";
                }
                if ($ca_id3 != "all" && $ca_id3) {
                    $sql .= " and m_idx = '".$ca_id3."'";
                }

 

이렇게 php로 작성된게 클래스명 메인리스트에 있어서요....

적으신 코드 더 밑쪽에 있을 것 같은데요.
위 SQL 코드는 DB불러오는 코드라.....
아마 리스트면 저 코드 밑쪽의 for , foreach, while 같은 반복문 안에 있을 것 같네요.
아님, 다른 파일에 작성 후, 위 소스 밑에 인클루드 시켰던가...

답변을 작성하시기 전에 로그인 해주세요.
전체 927
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT