HTML页面设计 网页布局
<body><form id="form1" ><div><ul style="width: 100%"><li style="width: 40%">abc</li><li style="width: 40%">def</li><li style="width: 20%">ghi</li></ul></div></form><body>
我的想法是让这三个列表项处在同一行，可是三个列表项并不在同一水平行。含有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的默认属性。
＆gt; gt;的目的是什么 元素？Mar 21, 2025 pm 12:34 PM本文讨论了HTML＆lt; Progress＆gt;元素，其目的，样式和与＆lt; meter＆gt;元素。主要重点是使用＆lt; progress＆gt;为了完成任务和LT;仪表＆gt;对于stati
＆lt; datalist＆gt;的目的是什么。 元素？Mar 21, 2025 pm 12:33 PM本文讨论了html＆lt; datalist＆gt;元素，通过提供自动完整建议，改善用户体验并减少错误来增强表格。Character计数：159
＆lt; meter＆gt;的目的是什么。 元素？Mar 21, 2025 pm 12:35 PM本文讨论了HTML＆lt; meter＆gt;元素，用于在一个范围内显示标量或分数值及其在Web开发中的常见应用。它区分了＆lt; meter＆gt;从＆lt; progress＆gt;和前
视口元标签是什么？为什么对响应式设计很重要？Mar 20, 2025 pm 05:56 PM本文讨论了视口元标签，这对于移动设备上的响应式Web设计至关重要。它解释了如何正确使用确保最佳的内容缩放和用户交互，而滥用可能会导致设计和可访问性问题。
如何使用HTML5表单验证属性来验证用户输入？Mar 17, 2025 pm 12:27 PM本文讨论了使用HTML5表单验证属性，例如必需的，图案，最小，最大和长度限制，以直接在浏览器中验证用户输入。
我如何使用html5＆lt; time＆gt; 元素以语义表示日期和时间？Mar 12, 2025 pm 04:05 PM本文解释了HTML5＆lt; time＆gt;语义日期/时间表示的元素。 它强调了DateTime属性对机器可读性（ISO 8601格式）的重要性，并在人类可读文本旁边，增强Accessibilit
＆lt; iframe＆gt;的目的是什么。 标签？使用时的安全考虑是什么？Mar 20, 2025 pm 06:05 PM本文讨论了＆lt; iframe＆gt;将外部内容嵌入网页，其常见用途，安全风险以及诸如对象标签和API等替代方案的目的。
热AI工具
Undresser.AI Undress
人工智能驱动的应用程序，用于创建逼真的裸体照片
AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。
Undress AI Tool
免费脱衣服图片
Clothoff.io
AI脱衣机
AI Hentai Generator
免费生成ai无尽的。
热门文章
热工具
SublimeText3 Mac版
神级代码编辑软件(SublimeText3)
MinGW - 适用于 Windows 的极简 GNU
这个项目正在迁移到osdn.net/projects/mingw的过程中，你可以继续在那里关注我们。MinGW：GNU编译器集合（GCC）的本地Windows移植版本，可自由分发的导入库和用于构建本地Windows应用程序的头文件；包括对MSVC运行时的扩展，以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。
Atom编辑器mac版下载
最流行的的开源编辑器
Dreamweaver CS6
视觉化网页开发工具
VSCode Windows 64位 下载
微软推出的免费、功能强大的一款IDE编辑器
