求助,关于
程序员文章站
2022-04-19 14:29:01
...
HTML页面设计 网页布局 标签的使用 这个是我网页表示层的部分代码:
我的想法是让这三个列表项处在同一行,可是三个列表项并不在同一水平行。含有ghi的那个
标签自动下移了新一行的左边。
我后来设置了所有元素的border,padding,margin为none或者0,但结果还是开始一样显示的。
我就是搞不明白,三个
标签加起来的不正好是100%的width么?为什么会超过
我的想法是让这三个列表项处在同一行,可是三个列表项并不在同一水平行。含有ghi的那个
我后来设置了所有元素的border,padding,margin为none或者0,但结果还是开始一样显示的。
我就是搞不明白,三个
- 的width。我试了把最后一个
- 标签的width改为19%,然后三个
- 就是并列显示了。(注:我已经设置了
- 的float为left了)。
大家能给我指点一下吗? 谢谢了!回复讨论(解决方案)
li是块级元素,是会自动往下排的,而不像p,img这类行级元素会直接连在后面,style里加上float:left; 这个属性就可以了,会变成漂浮元素进行漂浮排列,最后最好在所有
- 后再加上一行清除漂浮,以免影响接下来的布局
li是块级元素,是会自动往下排的,而不像p,img这类行级元素会直接连在后面,style里加上float:left; 这个属性就可以了,会变成漂浮元素进行漂浮排列,最后最好在所有
- 后再加上一行清除漂浮,以免影响接下来的布局
不好意思,没有注意到最后你已经漂浮了,既然是19%有问题,估计是哪个margin或者padding出问题,可能没检查出来,试试在样式里面加上一句 *{margin:0;padding:0} 呢假设ul在实际显示的时候宽度是789px,那么3个li标签的宽度分别是315.6px 315.6px 157.8px,应该是这个问题吧
一些老版本的浏览器不会认识float类型的宽度,造成了误差。一般在写代码时,就要考虑padding和magin的默认属性。
推荐阅读
-
终于成为博客员的一员了,这是我的第一篇博文,写一个关于ul li内容宽度的问题和解决方案_html/css_WEB-ITnose
-
菜鸟:关于24小时循环倒计时的问题_html/css_WEB-ITnose
-
菜鸟关于网页设计的一个小问题,在线等答案~_html/css_WEB-ITnose
-
关于浏览器默认CSS的问题_html/css_WEB-ITnose
-
ul li的兼容性问题_html/css_WEB-ITnose
-
关于浏览器默认CSS的问题_html/css_WEB-ITnose
-
关于padding设置的问题_html/css_WEB-ITnose
-
再发-关于CSS+DIV首页的问题(入门级别)_html/css_WEB-ITnose
-
菜鸟关于网页设计的一个小问题,在线等答案~_html/css_WEB-ITnose
-
问个关于浮动的问题_html/css_WEB-ITnose