块级元素 行内元素 常见元素 div、p、form、ul、ol、li span、a、strong、em 特性 独占一行,默认情况下,其宽度自动填满其父元素宽度
不会独占一行,相邻行内元素会排列在同一行里,直到一行排不下,才会换行,其宽度随元素的内容而变化
width、height属性 可以设置,设置了宽度还是独占一行 无效 margin和padding属性 可以设置 水平方向的padding-left、padding-right、margin-left、margin-right都产生边距效果，
但竖直方向的padding-top、padding-bottom、margin-top、margin-bottom却不会产生边距效果。
对应的相关display属性 block inline 切换 display:inline变成行内元素 display:block变成块级元素
1.行内元素会在一条直线上排列,都是同一行的,水平方向排列, 块级元素各占据一行,垂直方向排列。块级元素从新行开始结束接着一个断行。
2.块级元素可以包含行内元素和块级元素。行内元素不能包含块级元素。
3.行内元素与块级元素属性的不同,主要是盒模型属性上
4.行内元素设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效
5.行内元素转换为块级元素 :display:block ,块级元素转换为行内元素为 : display:inline
转载请注明原文地址: https://ju.6miu.com/read-678012.html
