简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
首页 > web前端 > html教程 > 正文

div 居中_html/css_WEB-ITnose

WBOY
发布： 2016-06-24 12:06:10
原创
996 人浏览过

<html><head></head><body>	<div align=center>		<div style="width:1100px;height:40px;border:2px solid red;">11111111111111111111</div>		<div style="float:left;width:200px;height:40px;border:2px solid red;">222</div>		<div style="float:left;width:200px;height:40px;border:2px solid red;">333</div>		<div style="float:left;width:700px;height:40px;border:2px solid red;">444</div>	</div></body></html>
登录后复制


只有第一个div 居中了，下面三个还是居左

怎么让他们都居中


回复讨论(解决方案)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style>.cf:after{content:'';display:block;clear:both;}.cf{zoom:1;}.f{margin:0 auto; width:1112px;}</style></head><body> <div class="box">        <div style="width:1100px;height:40px;border:2px solid red;margin:0 auto;">11111111111111111111</div>        <div class="f cf">            <div style="float:left;width:200px;height:40px;border:2px solid red;">222</div>            <div style="float:left;width:200px;height:40px;border:2px solid red;">333</div>            <div style="float:left;width:700px;height:40px;border:2px solid red;">444</div>        </div>    </div></body></html>
登录后复制

因为你下面三个div都使用了float处理。


11111111111111111111

222

333

444

相关标签：
div 居中
来源：php.cn
上一篇：Codeforces Round #239 (Div. 2)_Long Path_html/css_WEB-ITnose 下一篇：div中ul li超出宽度隐藏 且li不换行_html/css_WEB-ITnose
本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
通过添加 Width 属性将内容向左移动 我已经为主体提供了边距。主要{左边缘：200px;右边距：200px；文本对齐：居中}由于我想以两行而不是一行显示文本，因此我在样式中添加了width属性。.p{字体大小：12px...
来自于 2024-04-06 22:01:35
0
3
816
有没有办法强制弹性框中的文本垂直居中，无论我们有什么其他 CSS 代码？ 我有以下CSS代码，它是我正在开发的网站中使用的更大CSS代码的一部分：.cards-u{display:flex;flex-wrap:wrap;justify-content:c...
来自于 2024-04-06 20:41:51
0
1
518
为什么省略 0ms sleep 会破坏我的 css 转换？ 我正在尝试实现FLIP动画，看看我是否理解正确。在这个代码笔中（请原谅糟糕的代码，我只是在乱搞），如果我注释掉睡眠，平滑过渡将不再有效。div突然改变位置。这很奇怪，因为睡眠时间为...
来自于 2024-04-06 16:29:50
0
2
490
将工具提示与相对父级对齐 我花了两天时间试图解决这个问题，但我意识到我无法独自完成。我试图将我的工具提示相对于父级居中。这是我的代码=>letcollection=document.querySele...
来自于 2024-04-06 13:16:59
0
2
394
将 DIV 与两侧的内容居中对齐 所以我有5个项目（在包含DIV内）。项目阵容如下：文本图像DIV图像文本我希望它显示为DIV位于中央，图像“拥抱”DIV，然后文本“拥抱”图像，因此剩下的任何空间都将位于包含DIV...
来自于 2024-04-04 23:19:14
0
1
3438
相关专题
更多>
热门推荐
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！