☆ 일단 이 글을 읽으려는 방문자들 중에 html5 코딩에 대해서 기본 지식이라도 있다면 시간 낭비이니 그냥 나가시길. 아주 기초적이면서도 허접한 팁을 기술하려는 것이니 이 글을 읽는 것은 시간 낭비임.
나 같은 경우 일단 컴퓨터는 켜고 끄는 거 밖에 할 줄 모르는 흔히 얘기하는 컴맹임. 예전에는 네이버 블로그를 하다가 짜증이 나서 다른 포털로 옮기려다가 다음의 티스토리는 뭔 생뚱맞은 초대장이 필요하다 해서 제쳐버리고 구글 블로거로 이전을 하였다. 대체 뭔 그지 같은 초대장⁉️ 요즘에는 클럽 하우스라는 앱이 초대장이 필요하다던데 에고지풍이네. 어쨌든 구글 블로그를 하다 보니 다른 건 차치하더라도 가장 애로사항이 바로 사진 크기 조절이 가장 어렵다는 것이다.
HTML5 보기 |
블로그를 보면 사진을 크게 확대하면 이런 식으로 우측 가젯(?)
속으로 숨어버린다. 그렇다고 사진을 줄이면 넘 작아서 보기도 어렵고 당최
CSS 메뉴로는 조절하기가 힘들다. 지금까지 기냥 그러려니 하고 하고
있었는데 블로그 글을 쓰다가 좌측 상단을 보면....
블로그 작성 형식 선택 |
좌측 작성 아이콘(CSS?)을 클릭하면 일반 작성 모드인 '새 글
작성 보기'와 'HTML 보기'가 나온다. 거기서 'HTML 보기'를
선택하면
HTML 보기 |
그러면, 이런 알 수 없는 화면이 나온다. 이 상태로도 할
수는 있지만 복잡해 보이니 상단에 있는 HTML 형식 지정이란
아이콘을 클릭하면
정렬된 보기 |
이런 식으로 정리가 된다. 그러면 이 부분에서 사진
부분을 수정하면 된다. 사진에 관련된 부분은
사진 이미지 크기 |
사진 좌, 우 여백에 해당하는 margin-left: 1em(사진
좌측 마진)에서 1em에서 '1'을 '0'으로 바꾸어주면 좌측
여백이 없어진다. 사진 높이는 height="480", 사진 폭은
width="640"이 해당 항목이다. 난 아이폰 일반 모드로 찍은
사진이라서 거의 '매우 크게'로 올리면 우측이 많이
삐져나온다.
이제 저 치수를 알맞게 조정하면 된다. 뭐 나름대로
알아서 하면 되겠지만 나 같은 경우는 일단 폭이 아니 맞아서
우측이 튀어나오는 경우라 일단 폭을 먼저 맞춘 후 비율에
맞게 높이도 맞추었다. 굳이 높이까지 조정은 안 해도
되겠지만 사진이 실물과 비율이 달라서 이상해 보일 수도
있으니 각자 알아서들 하시길. 일단 폭은 570으로 하니 맞고
높이는 비율 계산을 하면 '480X640'이니 폭 대비 높이가
0.75니까 570X0.75는 427.5로 바꿨다.
틀을 벗어난 사진 이미지 |