CSS 속성 종류 4_CSS

2021. 12. 15. 11:57ksmart_html_css_js/css

728x90
display

- 선택된 대상의 inline, block, inline - block, none 처리

- inline : 인라인 오쇼 변경

- block : 블럭 요소 변경

- inline - block : 높이와 넓이를 가지는 인라인 요소로 변경

- none : 화면 미 노출

<style>
	.display01{
		display:none;
	}
	.display02{
		display:inline;
	}
	.display03{
		display:block;
	}
	.display04{
		display:inline-block;
		height:200px;
		width:300px;
	}
</style>
<div class="display01">
	display none
</div>
<div class="display02">
	inline
</div>
<span class="display03">
	inline > block
</span>
<span class="display04">
	inline > inline-block
</span>

 

line-height

- 텍스트(인라인 요소) 세로 간격 설정

.lineheight01{line-height:25px;
}
list-style

- 불릿 변경

<style>
	.list01 li{
		list-style:none;
	}
	.list02 li{
	list-style:decimal;}
</style>
<ul class="list01">
	<li>안녕하세요.</li>
	<li>안녕하세요.</li>
	<li>안녕하세요.</li>
</ul>
<ul class="list02">
	<li>안녕하세요.</li>
	<li>안녕하세요.</li>
	<li>안녕하세요.</li>
</ul>
​
728x90

'ksmart_html_css_js > css' 카테고리의 다른 글

CSS 속성 종류 _float_nav 만들기_CSS  (0) 2021.12.15
CSS 속성 종류 5_CSS  (0) 2021.12.15
CSS 속성종류 3_CSS  (0) 2021.12.15
CSS 속성 종류2_CSS  (0) 2021.12.15
CSS 속성 종류_CSS  (0) 2021.12.15