0829 인라인레벨요소/블록레벨요소, 화면에 보여주는 방식, 테두리

[삐돌이]

0829.zip

3.24KB

마운티아.zip

5.14MB

인라인레벨요소
 img, a, span, strong
 주로 내용부분 즉 화면에 표시한 콘텐츠들
 한줄에 여러개가 정렬.
 자신만 크기를 인식하여 표시함
 width, height를 적용하여 사용할 수 없다.


블록레벨요소
 div, p, ul, li, h1~h6........
 기본적으로 세로정렬
 한줄에는 하나차지합니다 즉 가로폭을 자신이 100%인식함
 width, height를 적용하여 사용합니다



display: 화면 보여주는 방식
display:none; 화면에서 숨김.
display:block; 블록레벨요소로 만듬.
                   (화면에 보여줌)
display:inline; 인라인레벨로 만듬
display:inline-block; 인라인레벨이면서 가로값과 세로값이 적용됨.

visibility:화면에 보이거나 숨기거나 함.
visibility:hidden; 화면에서 숨김
visibility:visible; 화면에서 보여줌

border: 요소의 테두리 선을 선언
border-width:1px;
border-style:solid;
corder-color:red;

 border:1px solid red;

 border-top:1px solid red;
 border-right:1px solid red;
 border-bottom:1px solid red;
 border-left:1px solid red;

outline요소의 아웃라인을 그림 border와는 별개의 속성이며 border를 설정한는 것과 같이 아래의 속성을 단축하여 사용할 수 있음
outline-style : 아웃라인의 형식
outline-color : 아웃라인의 색상
outline-width : 아웃라인의 두께
outline-offset:[d];