HTML Paragraphs
한글로 말하자면 "단락" 태그로써, <p>로 정의 된다.
<HTML> 태그 구조에 기초적인 요소로써 말 그대로 보통 "본문"의 "단락"을 표현하는데 사용된다.
예를 들면 다음과 같다
1 2 | <p> 이것은 paragrphs 이다. </p> <p> 이것은 단락 태그 이다. </p> | cs |
우리가 원고에 글을 쓰듯 보통 단락 앞뒤로는 여백이 자동으로 추가 된다.
단락 태그는 공백과, 띄어쓰기를 무시하는 속성을 가지고 있다. 예를 들어보자.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <p> 공백이 겁나 많은 단락 태그 예시. </p> <p> 수많은 줄이 존재 하는 단락 태그 예시. </p> | cs |
위 태그가 브라우져에 표시 될 때는 다음과 같다.
ex)
공백이 겁나 많은 단락 태그 예시.
수많은 줄이 존재 하는 단락 태그 예시.
<br>태그
<br>태그는 끝 태그가 없는 태그로 줄 바꿈을 지원하는 태그이다.
위에서 배운데로 이 태그는 다른 태그의 요소로 들어 갈 수도. 독자적인 태그로도 사용이 가능 하다.
즉 줄 바꿈을 원하는 장소에 <br>을 써주면 바로 줄 바꿈이 된다.
1 | <p>줄 바꿈 <br> 해보기 </p> | cs |
ex) 줄 바꿈
해보기<pre> 태그
쉽게 말하면 <pre> 태그는 <p>태그와 다르게 써진 양식이 그대로 표현 된다.
1 | <pre> 예 시 입 니 다 </pre> | cs |
ex)
예 시 입 니 다
HTML Style
웹 브라우저에 표시되는 요소의 색깔, 크기, 모양등 말 그대로 스타일에 관여하는 태그다.
기본적인 문법을 기준으로 사용하게 되는데 이는 다음과 같다
< 태그이름 style=" 값 " >
예로 < p > 태그의 스타일을 정한다면
<p style="값"> 이런식으로 작성한다.
여기 속성의 값은 CSS의 속성이다. 앞에서 말했듯 어떤 브라우져에 표시되는 골격을 캔으로 비유하자면 캔 자체에 대한 값은 HTML에 속하고 캔을 둘러싼 포장지는 CSS 값에 속한다 라고 이해하면 된다.
HTML 배경색
HTML요소의 배경에 대하여 정의할때 사용한다.
예를 들면 다음과 같다. <body>전체의 배경색을 검은색으로 한다면
1 2 3 4 5 6 7 | <body style="background-color:black;"> <h1> This is Heading </h1> <p> 이것은 단락문 입니다. </p> </body> | cs 이 |
HTML 텍스트 색상
태그내에 존재하는 텍스트 색깔을 지정하는 방법이다.
<태그이름 style="color:blue;"> 문장 </태그이름>
예)
HTML 텍스트 크기
마찬가지로 태그내의 텍스트 폰트의 크기를 지정할때 사용하는 방법이다
<태그이름 style="font-size:크기%;"> 문장 </태그이름>
예)
1 | <h1 style="font-size:300%;">This is a heading</h1> | cs |
HTML 텍스트 정렬
흔히 말하는 가운데 정렬, 앞 정렬, 뒤 정렬을 이야기 한다.
<태그이름 style="textalight:정렬;"> 문장 </태그이름>
예)
1 | <h1 style="text-align:center;">Centered Heading</h1> | cs |
HTML 텍스트 글꼴
1 | <h1 style="font-family:verdana;">This is a heading</h1> | cs |
날이 매우 덥내요. 다들 건강 조심하세요 :)
'여러가지 정보 > HTML CSS 와 블로그' 카테고리의 다른 글
HTML CSS 기초부터 배우기 6 (홈페이지 제작, 블로그 꾸미기 ) (0) | 2017.04.18 |
---|---|
HTML CSS 기초부터 배우기 5 (홈페이지 제작, 블로그 꾸미기 ) (0) | 2017.04.17 |
HTML CSS 기초부터 배우기 4 (홈페이지 제작, 블로그 꾸미기 ) (0) | 2017.03.31 |
HTML CSS 기초부터 배우기 3 (홈페이지 제작, 블로그 꾸미기 ) (0) | 2017.03.28 |
HTML CSS 기초부터 배우기 2 (홈페이지 제작, 블로그 꾸미기 ) (1) | 2017.03.23 |