티스토리 블로그를 만들고 글을 써 나가면서 요기는 좀 이렇게 해보고 싶고, 또 다른 곳은 또 어떻게 고치고 싶은데 막히는 부분이 생기기 마련입니다. 마음에 안들면 바꾸고 싶은데 잘 안될때가 있고 어떻게 바꿔야 할지 모를때가 있습니다. 그중에서 오늘은 티스토리 블로그 본문에 올린 이미지들의 테두리를 없애고 싶은데 어떻게 하는지 알려드리겠습니다.
티스토리 블로그 본문 이미지의 테두리가 있으면 아래와 같이 나타납니다.
보시기에 어떤게 좋아 보이시나요. 저는 왼쪽 테두리 있는게 영 거슬려서 마음에 안들었습니다.
티스토리 기본 셋팅은 위 이미지에서 좌측에서처럼 기본은 테두리 라인이 나오게 되어 있습니다. 저는 테두리가 있는게 싫어서 테두리가 안나오게 바꾸었습니다.
우선 블로그 관리로 들어가서 좌측 메뉴에서 HTML/CSS 편집 을 선택합니다. 그리고 화면이 새로뜨면 아래에서 2번으로 표시한 CSS 를 선택합니다.
CSS 편집창에서 창 아무곳이나 마우스로 선택하여 놓고 키보드에서 Ctrl + f 를 눌러 줍니다. 그러면 아래 그림처럼 윗부분에 노란 바탕에 단어를 검색할 수 있는 부분이 생깁니다. 그러면 그곳에 .imageblock 이라고 입력한 후에 엔터를 쳐줍니다.
엔터를 치고 나면 다음과 같이 검색한 단어와 일치하는 부분을 찾아서 보여줍니다.
위 이미지에서 표시한 부분이 본문에 추가한 이미지의 테두리를 결정하여 주는 부분입니다.
특히 { border:0px solid #ddd ..} 이 부분에서 테두리가 결정됩니다.
테두리가 0px 면 테두리가 없는 상태 를 말합니다.테두리를 표시하지 말라는 의미 로 보시면 됩니다. 그러니까 본문 이미지의 테두리가 안나오게 하려면 블로그 초기 값이 1px 로 되어 있는것을 0px 로만 바꾸어 주면 본문 이미지의 테두리가 나타나지 않는 것입니다.
위 이미지 테두리의 설정은 아래와 같습니다.
.imageblock { border:3px solid #aaa; ....
.imageblock { border:5px dashed #aaa; ....
앞서 설명드린 것처럼 테두리 라인의 두께를 두껍게 하려면 숫자를 올리면 되고 테두리 라인을 실선으로 하려면 solid , 점선으로 하려면 dashed 로 하시면 됩니다.
아예 이런 설정이 싫다면 .image block ~ 라인을 삭제해 버리면 됩니다. 그런데 굳이 삭제하실 필요는 없을 것 같고 두께 설정만 0px로 바꾸시는게 제일 좋은 방법이라고 생각합니다.
■ 블로그 관련 다른 Tip ■
정보가 도움이 되셨다면 ♡ 공감 클릭 부탁드립니다.
최근댓글