1. Style
<태그이름 style="속성이름: 속성값;">
- Style 속성을 적용하는 방법은 위 코드와 같다.
2. Style 적용
<!DOCTYPE html>
<p style="font-size: 200%;">글자 크기 변경</p>
<p style="color: blue;">글자색 변경</p>
<p style="background-color: blueviolet;">배경색 변경</p>
<p style="text-align:center;">문단 정렬</p>
<p style="font-size: 200%; color: brown; background-color: gold;">여러 스타일 설정</p>
2-1 "font size: 크기;"
- 글자 크기를 지정한다.
- 글자 크기 단위는 rem, em, px, %가 있다. ( 이 부분은 css 공부할 때 알아보도록 하자. )
2-2 "color: 색깔;"
- 글자색을 변경한다.
2-3 "background-color: 색깔;"
- 텍스트 배경색을 변경한다.
2-4 "text-align: 위치;"
- 문단 정렬을 한다.
- center는 중앙 정렬을 의미하며 오른쪽 정렬과 왼쪽 정렬을 하고 싶으면 right, left를 입력하면 된다. 이외에도 다양한 정렬이 있으니 검색해서 찾아보길 바란다.
2-5 여러 스타일 설정
- "속성: 값; 속성: 값; ~~"의 형식으로 세미콜론(;)으로 구분하여 여러 스타일을 설정할 수 있다.
'FrontEnd > HTMl' 카테고리의 다른 글
| [HTML] 리스트와 테이블 (0) | 2021.07.17 |
|---|---|
| [HTML] 링크와 이미지 (0) | 2021.07.17 |
| [HTML] 문자셋 (0) | 2021.07.17 |
| [HTML] 텍스트 요소 (0) | 2021.07.16 |
| HTML 의미와 기본 구조 (0) | 2021.07.14 |