HTML과 CSS의 차이, 블로그 폰트 크기 변경 어디서 할까?
본문 바로가기
그것이 알고 싶다

HTML과 CSS의 차이, 블로그 폰트 크기 변경 어디서 할까?

by 오늘작업실 2023. 3. 21.

티스토리에서 스킨편집을 하려고 하면 HTML이나 CSS에 들어가서 편집을 하게 됩니다. 일단 시키는 대로 따라 하긴 하지만, 도대체 HTML과 CSS가 무엇이 다르길래 어떨 때는 HTML에서 수정하고 또 어떨 때는 CSS에서 수정하는 걸까요? 블로그 글자크기 변경은 왜 CSS에서 하는 걸까요? 

 


HTML이란 우리가 작성하는 문서를 웹페이지에서 어떻게 보여줄 것인가를 표시하는 언어입니다. 

<html>로 문서의 시작을 표시하고 </html>로 문서의 끝을 표시합니다. 이와 같은  html 명령어를 우리는 태그라고 부릅니다.  띄어 쓰기를 표시하는 명령어인 &nbsp; 등 몇몇 예외를 제외하고 대부분의 태그는 <>로 시작하고 </>으로 끝을 맺어야 완성됩니다. 전체 문서는 <html>와 </html>사이에 적어야 하고 , 타이틀은 <head>와 </head> 사이에, 본문글은 <body>와 </body> 사이에 적습니다. 이렇게 태그의 시작과 끝을 잘 확인하면 중간에 아무리 다른 내용들이 많이 들어가더라도 실수 없이 수정할 수 있습니다.  

아래 박스안에 쓴 글자를 보여주기 위해서는  

내 블로그
글자크기   변경하기

아래와 같은 html 언어가 필요합니다.

<html>
<body>

<table style="border-collapse: collapse; width: 100%;" border="1" data-ke-align="alignLeft">
<tbody>
<tr>
<td style="width: 100%;">내 블로그<br />글자크기&nbsp; &nbsp; &nbsp;변경하기</td>
</tr>
</tbody>
</table>

</body>

</html>

문서 스타일, 이미지, 링크 등 여러 가지 문서 형식들이 html로 표시되기 때문에 실제 웹페이지의 html은 이보다 더 복잡합니다.


CSS란 웹페이지의 디자인적인 요소, 웹페이지의 스타일을 표시하는 언어입니다. 

CSS는 디자인에 대한 요구가 점점 많아지면서, html 태그에 페이지의 온갖 레이아웃과 더불어 디자인 요소까지 표시해야 하기 때문에 생기는 문제들, 이를테면 지나치게 복잡한 명령어 등을 간결하게 정리하기 위해서 만들어 졌습니다. CSS에서 웹페이지의 디자인 스타일을 전담하면서, Html은 디자인과 관련된 태그들은 빠지고 페이지 레이아웃등 본래의 기능을 살리는 방향으로 업그레이드되고 있습니다. 

CSS는 웹페이지의 전체 디자인 스타일을 정의하고 있습니다. 그래서 CSS에서 글꼴 등 디자인 요소 하나를 바꾸게 되면 전체 웹페이지에서 관련된 요소를 모두 찾아 한꺼번에 바꿔줍니다. 굳이 일일이 페이지를 확인하지 않더라도 일관되게 적용된다는 점이 특히 장점입니다. CSS에서 글자크기를 바꾸면 웹페이지 전체에서 글자 크기가 변경되는 것을 확인할 수 있습니다. CSS에서 이렇게 편리하게 활용할 수 있기때문에 HTML5에서부터 font 태그는 폐기되고, 이제 CSS에서 폰트 스타일을 변경하게 되었습니다. 이런 방식으로 CSS와 HTML로 기능이 구분되어 정리되고 명령어도 단순화되었기 때문에 웹페이지 로딩 속도도 빨라지는 효과가 있었다고 합니다.

티스토리에서 글자크기를 변경하는 법이 궁금하다면, 

 

티스토리 글자크기, 줄간격, 글자색_간단 수정법(font size)

티스토리에서 글자크기 변경하기/ 안녕하세요? 오늘작업실입니다. 오늘은 티스토리 블로그 본문에서 글자 크기와 줄 간격, 글자색을 바꾸는 아주 간단한 방법을 알아보겠습니다. 티스토리에서

dees421.tistory.com

 

이상으로 간략하게 HTML과 CSS의 차이를 살펴보고, 글자 크기를 CSS에서 수정하는 이유를 알아보았습니다. CSS를 수정할 때는 정확한 명령어가 아니면 전체 페이지가 로딩되지 않을 수도 있으니 주의하시기 바랍니다. 오늘 작업실이었습니다.

 

 

댓글