ZKX's LAB

如何使ul中li元素横向排列且不换行 li横过来

2021-04-03知识19

如何使ul中li元素横向排列且不换行 横向排列需要在CSS中设定一个浮点,属性名为float 设定为Left 或者 Right这两个有差别 如果是Left 它会往左开始 1 2 3 4 如果是 Right是 往右开始 4 3 2 1代码可以这么写lt;style;LinkUl { float:left;}lt;style;lt;div;lt;h3;lt;b;友情链接lt;b;lt;h3;lt;ul id=ul1 class=LinkUl;lt;li;这是第一列的第一个lt;li;lt;li;这是第一列的第二个lt;li;lt;li;这是第一列的第三个lt;li;lt;ul;lt;ul id=ul2 class=LinkUl;lt;li;这是第二列的第一个lt;li;lt;li;这是第二列的第二个lt;li;lt;li;这是第二列的第三个lt;li;lt;ul;lt;ul id=ul3 class=LinkUl;lt;li;这是第三列的第一个lt;li;lt;li;这是第三列的第二个lt;li;lt;li;这是第三列的第三个lt;li;lt;ul;lt;div;也可以适用于lt;li;标签

如何使ul中li元素横向排列且不换行 一种方法,给li标签设置display:inline-block;第二种方法,设置float:left;

如何使ul中li元素横向排列且不换行 因为li是块级元素,默认占一行的,要想实现横向排列,一般通过以下两个方法:float:left 这样设置有一个问题,li浮动以后则脱离了文本流,即不占位置,如果它的父级元素有具体的样式且没有固定宽高,建议父元素清除浮动,或者设置固定宽高

#li横过来

随机阅读

qrcode
访问手机版