사진삽입시 테두리 없애기

사진삽입시 테두리 없애기

티스토리에서 사진이나 그림을 깔끔하게 삽입하는 방법에 대해서 글을 올렸는데
이번에는 사진삽입시 발생하는 테두리를 없애는 방법에 대한 내용입니다.

- 티스토리에서 이미지 삽입시 깔끔하게 삽입하기

테두리를 없애는 방법은 style.css 파일을 직접 수정하여 영구적으로 제거하는 방법과
티스토리의 편집기에서 필요할때마다 제거하는 방법 있습니다.

첫번째 방법. 글편집기에서 제거하는 방법

이 방법은 저도 사용하는 방법인데 필요할때마다 테두리를 제거작업을 해야 한다는 것입니다.
방법은 아주 쉽습니다.

1. 먼저 사진을 삽입합니다.
2. 삽입한 사진을 한번만 클릭한 다음 아래 그림과 같이 도구모음줄을 보면 정렬 아이콘이 바뀌어 있습니다.
    그중에서 제일앞쪽에 있는 정렬 아이콘을 클릭합니다.

사진을 클릭하면 사진 둘레로 사각점이 생깁니다.

3. 이제 사진앞에 공백을 클릭하여 커서가 깜빡이게 합니다.
   그리고 다시 도구모음줄에서 가운데 정렬 아이콘을 클릭하면 그림이 가운데로 정렬이 됩니다. 
   (만약에 그림을 가운데로 정렬하지 않을 거라면 3번단계는 건너뛰면 됩니다) 

 

테두리가 있는 사진 예.

테두리가 없는 사진 예.

 

두번째 방법. style.css를 수정하는 방법

이 방법도 티스토리 기준이며 매우 쉽습니다. 이 방법은 딱 한번 수정을 하면 영원히 테두리가 사라집니다.
물론 다시 style.css를 수정한다면 테두리가 나타나게 할 수도 있습니다. ^^

1. 관리페이지  "스킨 - HTML/CSS 편집"을 클릭하세요!

2. 아래쪽에 있는 style.css에서 아래의 빨강색글자를 삭제하고 저장하면 끝입니다. 

style.css의 내용

/* 이미지 아래 캡션 스타일 */
    .cap1                   { color:#999;  text-align:center; padding:4px 0; margin:0;}
/* 그림 */
    .imageblock      { border:1px solid #ddd; padding:3px; margin:5px 0; text-align:center; }
/* 왼쪽 */
    .left                   { }

아주 간단합니다. 끝. ^^

[초보블로거를 위한] - 블로그 포스트 제목색 바꾸기
[HTML/CSS의 기초] - [블로그기초학습] HTML 태그의 사용 형식