본문 바로가기

HTML-CSS

Blocks and Inlines

html의 다양한 태그들은 block이거나 inline 이다.

 

1. Block

대표적을 div태그가 있다. 이는 옆에 아무것도 올 수 없다. 예를들어 div태그 세개를 나란히 작성하여도 각각이 block이므로 세개가 세로로 배치된다.

block은 높이와 너비를 가질 수 있다. css코드 내에서 width 와 height값을 부여할 수 있다.

거의 대부분의것들이 block이므로 block이 아닌것을 몇개 외우는게 좋다.

ex) div, address, blockquote,  등등...

 

2. Inline

block의 반대 개념이다. 옆에 무언가가 올 수 있는 태그로, 짧은 글이나 사진등이 포함된다. 짧은 글인 span태그를 여러개 나란히 작성하면 span 옆에 span 이런식으로 배치가 된다.

주로 사용하게 될 것들은 span, img,a (링크) 이다.

inline은 높이와 너비를 가질 수 없다. 즉, css코드에서 width 와 height를 가질 수 없다.

ex) span, img (image), code, 등등...

'HTML-CSS' 카테고리의 다른 글

Classes  (0) 2022.09.07
Margin, Padding, Border  (0) 2022.09.07
css 내용정리  (0) 2022.09.07
CSS를 페이지에 추가하는 방법!  (0) 2022.09.07
HTML  (0) 2022.09.07