보통 블로그에 글을 포스팅 시에 글에 이미지를 넣는 경우가 많습니다. 그리고 이미지를 만들기 위해 컴퓨터 캡처를 많이 사용합니다. 이때 이미지 테두리가 흰색이면 테두리 구분이 없기에 가독성이 조금 떨어지거나 경계가 애매할 수 있습니다. 오늘은 티스토리에서 쉽게 테두리를 넣는 방법을 알아보겠습니다.
테두리 삽입 방법
우선 글을 작성하고 나서 기본 모드에서 HTML모드로 변경해줍니다. 그렇다면 이미지 부분 태그는 아래와 같이 되어 있을 겁니다.
위의 부분을 아래에서 <이미지 정보> 부분에 삽입을 해주면 됩니다.
<div style="border: 1px solid black;">이미지정보</div>
기본적으로 css에서 테두리를 위해 border라는 속성을 사용합니다.
- 1px는 테두리 두께를 의미합니다.
- solid는 일반 실선을 의미합니다.
- 마지막으로 black은 테두리 선 색깔을 의미합니다.
상황에 맞게 변경을 해주시면 됩니다.
주의할 점은 캡션을 넣어두면 캡션까지 테두리를 그립니다.
이미지 캡션이 있을 시
이미지 캡션이 없을 시
정리
위와 같이 코드 몇 줄로 간단하게 이미지에 테두리를 입히는 방법을 알아보았습니다. 이와 더불어 solid 속성 말고도 다른 속성을 통해서 실선이 아닌 여러 선들로도 변경이 가능합니다.
