일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
- Math.round()
- toFixed()
- ctrl+/
- 파일질라설치오류
- excel중복체크
- slideUp
- calc.plus
- hide
- FileZilla설치
- Math.floor()
- calc.minus
- Parent
- FileZilla다운로드
- 증가값
- selectoptions
- 파일질라다운로드
- selectedIndex
- SUB함수
- index %
- removeClass
- push오류
- addClass
- Git
- Math.ceil()
- 파일질라설치
- is_check
- Excel
- 소스트리인증실패
- 1521
- 주석이 먹히지 않을 때
- Today
- Total
잡동사니에도 사랑을
[21.09.09] exam12 - 블록 레벨 요소(div, p, h1, ul)/인라인 레벨 요소(span) 본문
[21.09.09] exam12 - 블록 레벨 요소(div, p, h1, ul)/인라인 레벨 요소(span)
luvforjunk 2021. 9. 9. 18:58<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1 style="background:orange">block-level elements</h1>
<div style="background:orange">block-level elements</div>
<p style="background:orange">block-level elements</p>
<em style="background:orange">inline-level elements</em>
<span style="background:orange">inline-level elements</span>
<span style="background:yellow">inline-level elements,
inline-level elements, inline-level elements, inline-level elements
inline-level elements, inline-level elements, inline-level elements
inline-level elements</span>
</body>
</html>
<!--
① 블록 레벨 요소(div, p, h1, ul)
- 블록 레벨 요소는 자신을 감싸는 상위의 요소가 허용한 가로 폭 전체 영역을 차지한다.
- 블록 레벨 요소는 너비나 높이를 지정할 수 있고, 줄 바꿈 속성을 가지고 있다.
② 인라인 레벨 요소(span)
- 인라인 레벨 요소는 흘러가는 요소이다.
- 인라인 레벨 요소는 너비나 높이를 지정할 수 없으며, 줄이 바뀌지 않는 형식(inline)으로 표현된다.
- 줄이 바뀌지 않지만, 내용이 많아서 그 상위 블록요소의 영역을 가득 채우게 되면 줄이 바뀐다.
-->
- em태그는 강조를 하면서 글씨가 기울여져있다.
- span은 입력된 글자만큼 크기를 잡아준다

'JAVA_EE > HTML' 카테고리의 다른 글
[21.09.09] exam10 - cellpadding / cellspacing / colspan / rowspan (0) | 2021.09.09 |
---|---|
[21.09.09] exam11 - id 속성과 class속성(버튼 색 바꾸기) (0) | 2021.09.09 |
[21.09.09] exam13 - <mark>/<abbr>/<dfn>/<cite>/<small>/<ruby> (0) | 2021.09.09 |
[21.09.09] exam14 - <blockquote>사용한 인용문 구현 (0) | 2021.09.09 |
[21.09.09] exam15 - <pre>/<code>/</> 활용하여 코드 작성하는 방법 (0) | 2021.09.09 |