최신글 제목부분의 색상을 바꾸고 싶습니다.
본문
안녕하세요, 초보제작자입니다.
색상변경에 대해서 질문드리고자 글을 적습니다..
사용중인 테마
-> http://theme.sir.kr/gnuboard5/index.php?theme=community&device=mobile [커뮤니티 / 모바일버전]
위의 주소로 접속했다고 가정하고, 말씀드리겠습니다.
해당 테마의 모바일버전에서, 위의 사진에 표시한 빨간부분의 배경색을 변경하고 싶습니다.
크롬브라우저에서 F12 모드로 진입하여, 확인한결과로는
초록색으로 표시한 부분까지도 한박스로 묶여있다는 것 입니다.
그래서, 배경색을 변경했더니, 빨간색표시된 부분만 변경되는것이 아니라
초록색부분까지도 변경이 되버리더라구요...
혹시, 빨간색부분만 변경할 수 있는지가 궁금합니다.
답변 2
그럴 땐, 빨간색 부분만 다시 별도로 div나 span으로 묶고 별도로 아이디나 클래스 부여 후, 스타일 적용하시면 됩니다.
블럭 요소 (=한 줄 차지 요소)는 div로 주로 묶고,
인라인 요소 (=딱 요소 길이만 차지하는 요소)는 span 으로 묶으시면 됩니다.
물론, display 속성을 이용해 테그의 속성을 변경 가능하긴 합니다.
개인적으로 권해드리는 건, 스킨을 수정하면서 늘기도 하지만,
HTML CSS를 제계적으로 공부하신 후 스킨 수정을 권합니다.
스킨 수정하며 HTML CSS 찾아보며 하는 것보다,
날 잡고 HTML CSS 독파 후, 수정하면 훨씬 작업 속도가 빨라집니다.
(뻥 하나도 안 붙이고, 약 10배는 빨라짐. ㅎㅎ)
제작자의 길로 들어셔셨으니, 특히나 그렇게 하는 것이 맞습니다. ^^
홈짱님, 댓글 감사드립니다 ^^
제가 워낙 무작정 뜯어고치기식이라, 해주신 말씀이 어떤 말씀인지 이해가 가질 않네요...ㅠ
빨간색부분을 별도로 div묶고 아이디 클래스 부여, 스타일적용..
약간, 직설적으로 설명해주실 수 있나요..?..
답변 있으시기전까지 한번 부딪혀보긴하겠습니다!!
<div class="hz_title">자유게시판</div> 처럼 div 태그로 묶고
최신글 css 맨 하단에..별도로
.hz_title {color:blue; font-weight:bold; text-decoration:none; .......} 식으로 정의
정말 죄송한데.. <div 말씀해주신부분을 어디 파일에 넣어야하나요..?..
mobile.css쪽에 color 이런거 넣으시라는건 이해가 갔는데...ㅠㅠ
귀찮게 해드려 죄송합니다..
저 빨간 색 부분의 요소를 찾으셔서 묶으셔야 겠지용 ^^
css는 저 페이지를 정의하는 style.css 파일에 넣으셔도 되고,
별도로 style 파일 만들어 넣으셔도 되고,
아님, 그냥 해당 요소에 직접 스타일 넣으셔도 되고....스타일 넣는 방법은 여러가지에요.
http://www.homzzang.com/b/css-3 참고하세요.
애써 답변 열심히 해주셨는데..
해당요소를 찾아서 묶는게 너무 어렵네요..ㅠㅠ
제 실력으론 무리인가 봅니다...
이것저것 해봤는데, 원하는방향으로 수정이 되질 않네요..
밥상 다 차려놓고 수저까지 올려져 있어야 따라하는 실력이다보니..ㅠㅠ
홈짱님께서 커뮤니티 테마 적용해보시고, 색변경 하신다음에
알려주셔야 가능할정도로 멍청이입니다...
하지만, 그정도로 양심불량은 아니라서..
테마 제작자분글에 댓글 달아봐야겠네요..ㅠㅠ
모바일의 최신게시글을 예로 알려드리겠습니다.
스타일은 각 스킨마다 따로 지정해 주셔야 합니다.
이미지는 클릭해서 보세요
html 경로 : community/mobile/index.php
수정 전 ↓
html에서 div를 감싸고 class를 추가하여 css에서 스타일을 적용합니다.
수정 후 ↓
css 경로 : community/mobile/skin/latest/new_latest/style.css
수정 전 ↓
수정 후 ↓
이런 방식으로 해당 스킨의 html과 css를 수정해 주시면 됩니다.
메인에 '최신 게시글'은 html로 작성되어 있지만 공지사항, 자유게시판 등 은 php로만 작성되어 있습니다.
인덱스에서 표시되는 글은 모두 최신글 이며, 최신글 스킨은 skin/latest에 있습니다. 각 명칭의 스킨 파일은 각 스킨에서 보이는 것과 같이 basic과 gallery에서 수정하면 됩니다.
파일 경로는 여기서 수정하면 됩니다.
수정 전 ↓
수정 후 ↓
css도 해당 파일에서 추가하여 수정하면 됩니다.
그래도 잘 모르시겠다면 코딩을 조금 더 공부하신 뒤 수정하시거나 매뉴얼 : http://sir.kr/manual/ 을 참고해보세요!
와 정말 감사합니다..ㅠㅠㅠ
시간들여서 정성스럽게 너무 답변 잘해주셔서 해결보았습니다!! ^^
우와... 만드신 테마 저도 이용하여 사이트 제작중인데
(전 css 등 몰라서 의뢰를 맡기고 부분 부분 어디를 만지면 어디가 고쳐지는건지 스스로 찾아보며 약간 공부 중^^)
이 부분도 궁금했는데 매우 도움되고 공부까지 되네요~
정말 보기에도 알기쉽게 친절한 답변이네요.
대단하십니다~
감사합니다~
