본문 바로가기
워드프레스

워드프레스_이미지나 사진 테두리 선 없애는 법

by reviewer_life 2014. 11. 20.
반응형

안녕하세요!! 우기블로그입니다. 오늘은 워드프레스 궁금증 해결하기 두번째 시간이네요. ^^ 오늘의 궁금증 해결은 이미지/사진/그림에 생기는 테두리 선을 없애는 것입니다. 홈피를 만들면서 도대체 저 선은 왜 생기는거야!! 하면서 늘 궁금했는데, 스타일 CSS 하나만 바꿔주면 쉽게 해결되네요. ㅎㅎ  

 

아래 그림에 보시는 바와 같이 테두리 부분이 나타납니다. 흰색 바탕화면과 똑같은 색깔로 작업한 이미지에 선이 생기니 뭔가 부자연스럽고, 보기 싫네요.

 

 

 

그래서 이 실선과 같은 것에 대해서 알아봤습니다. 저런 선을 border 라고 부르는데요. 이 용어를 모르고 무작정 구글링과 네이버 검색을 하니 뜬구름 잡는 다른 내용만 나와서 전혀 해결하지 못했다가 워드프레스 공식 사이트에 있는 메뉴얼 페이지를 보고야 알게 되었네요. 저 같은 초보는 뭐든지 힘이 드네요. ㅎㅎ 

 

여하튼 이제 고치러 가셔야죠? 자아! 그럼 관리자 화면 Dash board로 들어가 주세요.

거기에서  Appearance 외모? 외형에 가셔서

테마 에디터에 들어갑니다.

테마 에디터 오른쪽 부분에 있는 파일을 선택하는 부분에서 style.css를 선택해 주세요.

 

Dashboard(관리자화면) < Appearance(외모) < 테마에디터 < Style.css

 

 

 

그러면 아래 화면과 같은 태그가 쭈~~~~~~~~욱 나오게 됩니다. 그중에서 img borders나 image borders 부분을 찾아가야 합니다. 가장 상단에 있는 img borders에는 선의 굵기가 영(Zero, 0)으로 맞추어져 있네요. 그럼 이건 아니라는 뜻인데, 아래 쪽에 좀더 찾아보니, /* Image borders */ 라는 부분이 있어서 거길 고쳐줬더니 모든 이미지마다 뜨던 실선 테두리가 사라지는 것을 볼 수 있었습니다.

 

 

제 테마에서더 border: 1px에 솔리드 #ddd라고 나와 있죠? 그걸 none이나 0 으로 고쳐주세요. (방법은 글자 부분을 백스페이스나 델리트 키를 이용해 지우고, 키보드로 써넣으시면 됩니다. ^^)

 

 

 

 

아래 그림이 테두리를(borders) none 으로 적어 넣은 장면입니다.

 

 

 

 

자아! 이제 적용된 화면을 보실까요? 이미지에 나온 테두리가 깔끔하게 사라졌죠? ㅎㅎ

 

 

대충 이런 식으로 워드프레스를 뜯어 고쳐 나가면 언젠가는 자신이 원하는 멋진 홈피나 블로그 하나 탄생하지 않을까 예상됩니다. ㅋㅋ 그럼 즐거운 하루되세요!!

반응형