-
Html속 Css적용(Html내부 방식) 간단 예제
CSS를 사용해 문단 들여쓰기 효과 만들기
(문단 전체를 오른쪽으로 이동시키기).CSS의 padding과 margin을 사용한다.
(padding은 박스경계선에서 안쪽 여백, margin은 박스경계선에서 밖쪽 여백)HTML 문서의 <head></head>사이에 아래 코드를 넣으면 된다.
<style> p.test1{ padding-left: 2.1em } </style>위에서 "p.test1"는 p tag중에 "test1"라는 이름의 문단에 대한 정의다
HTML의 body 부분에서
<p class="test1">들여쓰기되는 글자</p>로 된 내용은 모두 들여쓰기가 된다.
em은 길이를 폰트 크기에 따른 비율로 크기 값이 결정되게 된다.
예제 코드
Ex 코드
<style>p.text22{ margin-left: 5.0em }</style> <p class="text11">hello11</p> <p class="text22">hello22</p> <p class="text33">hello33</p>Ex 결과
hello11
hello22
hello33
'Html Css JavaScript' 카테고리의 다른 글
문서구조 잡기 header main footer nav article section aside div (0) 2022.11.13 meta (0) 2022.11.13 Html 문단 줄바꿈 (div, p, br) tag (0) 2022.11.13 HTTP Session(세션) (0) 2021.10.26 Html 글자 배치 (0) 2021.01.09 Html - 목록 태그 (0) 2020.07.30 Html - 글자 형태 태그 (0) 2020.07.30 Html - head에 허용되는 태그 (0) 2020.07.30