1. 블록
2. 인라인
3. 속성에서 많이 사용하는 것들
1. 블록
display 속성값이 블록(block)인 요소는 언제나 새로운 라인(line)에서 시작하며, 해당 라인의 모든 너비를 차지한다.
<p>, <div>, <h>, <ul>, <ol>요소는 display 속성값이 블록(block)인 대표적인 요소
1-1) <p>
<p>문단을 출력하는 엘리먼트</p>
1-2. <div>
<div>블록 요소, 가장 많이 사용하는 엘리먼트</div>
1-3. <h>
<h1>제목을 출력하는 엘리먼트(위아래로 공백,블럭요소)</h1>
1-4. <ul>
: unordered list 로 순서가 숫자로 정해진 것이아니라 검은점 형태로 출력이 된다.
<ul>
<li>아메리카노</li>
<li>카페라떼</li>
<li>핫초코</li>
<li>차
<ul>
<li>녹차</li>
<li>홍차</li>
<li>자스민차</li>
</ul>
</li>
</ul>
1-5. <ol>
: ordered list로 순서가 있는 리스트로 출력시 앞에 숫자형 리스트로 출력된다.
<ol>
<li>아메리카노</li>
<li>카페라떼</li>
<li>핫초코</li>
</ol>
<ol type="A" start="10">
<li>녹차</li>
<li>홍차</li>
<li>자스민차</li>
</ol>
2. 인라인
요소의 너비도 해당 라인 전체가 아닌 해당 HTML 요소의 내용(content)만큼만 차지한다.
<span>, <a>, <img>요소는 display 속성값이 인라인(inline)인 대표적인 요소이다.
2-1. <span>
<span>한칸 띄어서 출력이 된다.</span>
2-2. <a>
<a href="http://www.r-blockchain.tistory.com">r-blockchain 블로그로 이동</a>
2-3. <img>
<img src="/html에그림이 링크 된다.png" alt="연결">
3. 속성에서 많이 사용하는 것들
id, class, alt 등이 있다.
3-1. id
: 특정한 엘리먼트를 나타내는 이름, 하나의 엘리먼트에 하나의 ID를 설정할 수 있다. 중복될 수 없음.
3-2. class
: 엘리먼트의 클래스 이름을 정하여 묶음으로 설정 가능
3-3. alt
: 파일을 가져오지 못했을 시 출력하는 텍스트
'블록체인 개발' 카테고리의 다른 글
이미지 관련 태그 & form 형식 (0) | 2023.06.14 |
---|---|
웹 브라우저란 (2) | 2023.06.13 |
개발이란 ? (0) | 2023.06.12 |
블록체인 개발 기초 - CSS(선택자) (0) | 2023.06.08 |
WEB 개발 입문 (0) | 2023.06.02 |