Tistory정보

Tistory) image 이미지 넣을 때 주변에 검은색 실선 넣기, html 편집

summerorange 2022. 5. 10. 21:59
반응형

포스팅을 하다가 이미지 넣을 때 흰색 바탕화면이면 차이가 없어서 실선을 넣는 게 좋을 것 같단 생각을 했습니다.

티스토리 설정 - 스킨 편집으로 들어가기!

스킨 편집

현재 오딧세이 html을 쓰고 있습니다. 각자 사용자가 현재 쓰고 있는 스킨이 나타날 거예요. 여기에서 html 편집을 클릭!

다음과 같이 나올 텐데 위쪽을 보면 css를 클릭!

img

img { border-style: 1px solid #000; } 

으로 수정하고 적용! 해주었습니다.

해당 의미는! 이미지(img)일 때는 테두리-스타일(border-style): 1픽셀(1px)정도 실선(solid) 검은색(#000000); 으로 변경해달라는 뜻입니당.

실선을 두껍게 하고 싶으면 숫자를 늘리면 됩니다. 3px ~ 

색상을 바꾸고 싶으면 #000000 -> 이게 헥사 코드 컬러였던가? 이름이 기억이 안나는데 #하고 여섯자리 숫자가 RGB를 나타냅니다. 그냥 green 으로 쳐도 될 것 같긴한데 예쁜 컬러를 위해서는 헥스 코드 검색해서 넣으면 좋아용. 그런데 전 블랙. 심플하게 가겠습니당

이렇게 쓰고 적용!...이 안된다ㅋㅋㅋㅋ 후... 

1. 그래서 다시 포스팅에 들어가서,

2. 검사 페이지를 열고,

저기 해당되는 이미지 클릭해보고 하단에 border: 1px solid #000; 이렇게 다시 추가해주니 됩니다. 그런데 찾아보니 #tt-body-page 였군용....! 이건 굳이 따라할 필요는 없습니다. 뭐가 문젠지 찾아낼 때 웹 검사 도구 툴들을 쓸 수 있습니다.

개발자 도구 툴로 들어가서 확인했습니당. 스킨 마다 다를 거예요

다시 티스토리 설정 - 스킨 편집 - html 편집 - css 로 들어가서

ctrl + f 눌러서 #tt-body-page 를 검색해서 img 찾았습니다. 저 하단에 코드를 쓸거예요

하단과 같이 바꿔주었습니다

border: 1px solid #000; 

추가해주기

#000000 이렇게 해도 상관 없습니당. 혹은 다른 컬러로 해도 상관 무.

이전 포스팅을 확인해보니 적용이 된 걸 확인했습니다.

 

끗!

반응형