css块级元素,内联元素,内联块状元素

时间:2023-03-08 22:25:19
css块级元素,内联元素,内联块状元素

块元素

什么是块级元素?在html中<div><p><h1><form><ul>之类的就是块级元素.设置display:block是就将元素显示为块级元素.如下代码就是将内联元素a转换为块状元素,从而使a元素具有块状元素特点.

块级元素特点:

1.每个块级元素都从新的一行开始,并且其后的元素也另起一行.

2.元素的高度,宽度,行高以及顶和底边距都可设置.

3.元素宽度在不设置的情况下,是它本身你窗口的100%(和你元素的宽度一致),除非设定一个宽度.

内联元素

在html中,<span><a><label><strong><em>就是典型的内联元素(inline)元素.当然块状元素也可以通过代码display:inline将元素设置为内联元素.从而使div元素具有内联元素特点.

内联元素特点:

1.和其他元素都在一行上;

2.元素的高度,宽度及顶部和底部边距不可设置.

3.元素的宽度就是它包含的文字或图片的宽度,不可改变.

内联块状元素

内联块状元素(inline-block)就是同时具备内联元素,块状元素的特点,代码display:inline-block就是将元素设置为内联块状元素.<img><input>标签就是这种内联块状标签.

inline-block元素特点:

1,和其他元素都在一行上;

2.元素的高度,宽度,行高以及顶和底边距都可设置.