行内元素在Div+Css布局中也是大量的存在,相对块框来说,行内元素更加不好用css修饰,行内元素又分置换元素与非置换元素,关于它们之间的区别,请移步《Html中的非置换元素与置换元素》。height,padding及margin在非置换元素中都不起作用,你只有使用font-size,line-height来设置它的高度,但是单行的行内元素line-height起的作用似乎不大,那我们应该怎么办?下面就用一行代码让你的行内元素的修饰如同块级元素一样简单,但是它表现的样式还是如同行内元素,不会使元素占据一整行。

display:inline-block;

上面的代码可以让你的行内元素设置padding,margin及height等值,但它不会如同块级元素一样占据一整行。

关于inline-block,你们可以去百度一下。

Last modification:April 11th, 2020 at 09:18 pm
如果觉得我的文章对你有用,请随意赞赏