Notice
Recent Posts
Recent Comments
Link
«   2024/05   »
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
Tags
more
Archives
Today
Total
관리 메뉴

름름

inline요소 vs block요소 본문

Tip

inline요소 vs block요소

름름_ 2017. 9. 12. 20:37

 항목

inline

block 

inline-block 

영역 

컨텐츠 크기만큼 

widthd와 height지정값

 지정값이 없을시 부모의 가로값, 세로는 컨텐츠크기 

 지정값

지정값이 없을시 너비

정렬

텍스트정렬에 영향을 받음 

margin 과 padding

table내부의 경우 vertical-align 

텍스트정렬에 영향을 받음 

박스모델 

margin 좌우, padding, border, float 

margin, padding, border, float 

margin(auto x), padding, border, float 

중첩요소 

inline요소만 가능 

inline과 block요소 모두가능 

inline요소만 가능 

특징 

포지션이 텍스트와 유사하게 처리됨 

양옆에 다른 요소가 올수없음 

포지션이 텍스트와 유사하게 처리됨 

엘리먼트 

span, a, strong, em 

div, h1~h6, p, ul, li 

img, input 



'Tip' 카테고리의 다른 글

img 마우스 오버시 테두리 안쪽으로 주기  (0) 2017.09.14
div안의 img에 높이4px공백  (0) 2017.09.13
폼태그 input 에서 id와 name  (0) 2017.01.13
글자생략 코드  (0) 2016.12.19
텍스트 사이 세로라인 만들기  (0) 2016.12.19
Comments