关于div+css布局值得注意的地方

注意项

我们知道，如果想要两个 div(即块级元素）挨着一起排列，可以将其设置为inline-block（行内-块元素）。

不过要注意两个div内的内容的对齐方式将是垂直中间对齐，所以这时候就需要使用float浮动。

使用float的时候有个问题：当一个元素盒子被浮动后，下面的元素会自动堆叠处理，导致元素不可见。

这时我们可以使用clear属性。

多次遇到的坑

当我们使用div+css布局的时候，即使把两个div盒子声明为inline-block，仍然无法使其并排显示。

那么问题就出在于没有声明两个div盒子的宽度。因为没有声明，所以系统会认为div盒子的宽度为100%。

因此要给div盒子声明宽度，并且并排的div盒子的宽度加起来需要小于父级元素的宽度。

转载于:https://www.cnblogs.com/wuguanglin/p/6660488.html

关于div+css布局值得注意的地方相关推荐

DIV+CSS布局的几点建议
http://www.cnblogs.com/bindsang/archive/2008/07/28/1254385.html DIV+CSS布局的几点建议玩Web重构也有段时日了,算有了那么些心得 ...
网页设计（四）——DIV+CSS布局3
前言:好久没更新过CSDN博客了,现在从原来的OI,变成了一个科研工作者.最近打算把原来的一些资料整理一下,作为经验公开分享,希望能帮到更多默默努力耕耘的人~ 网页设计系列源于早几年在学校网站工作做入 ...
根本不存在 DIV + CSS 布局这回事
实际上div不是用来布局的,div只是用来表示一个其它元素都无法准确表达语意的一个块区,只有CSS是用于布局的,所以根本就不存在div+CSS布局这回事.反过来,table布局的时候经常依赖于CSS定 ...
div+css 布局下兼容IE6 IE7 FF常见问题
div+css 布局下兼容IE6 IE7 FF常见问题收藏所有浏览器通用 (市面上主要用到的IE6 IE7 FF) height: 100px; IE6 专用 _height: 100px; I ...
DIV+CSS布局基本流程及实例介绍
都说用DIV+CSS布局来设计网站便于优化,容易被收录,那么你对DIV+CSS布局的用法是否了解?CSS布局是网页html通过DIV标签+CSS样式表代码开发制作的(html)网页的统称.DIV+CS ...
计算机创新课堂教案,广东省创新杯说课大赛计算机类一等奖作品：《DIV+CSS布局网页》教学设计方案...
<广东省创新杯说课大赛计算机类一等奖作品:<DIV+CSS布局网页>教学设计方案>由会员分享,可在线阅读,更多相关<广东省创新杯说课大赛计算机类一等奖作品:<DIV ...
DIV+CSS布局概述、属性（浮动、定位等）、布局类型、常见布局技巧
文章目录布局概述网页布局页面元素定位机制布局常用属性浮动属性(float) 清除属性(clear) 定位属性(position) 溢出属性(overflow) 层叠属性(Z-index) 布 ...
DIV CSS布局中绝对定位和浮动用法
转自:http://developer.51cto.com/art/201009/223337_1.htm 你对DIV CSS布局中绝对定位和浮动的概念及使用是否熟悉,这里和大家分享一下,CSS中,实 ...
关于css加div布局和表格布局,菜鸟学习笔记:表格布局和div+css布局
网页布局可以通过表格和div元素来实现(注:table布局已经淘汰),首先我们来看看table布局表格布局导航推荐文章一个猴子成长史你看个毛线我就瞅你咋地村里出了个半边天一个猴子的成长 ...
DIV+CSS布局图片加阴影效果方法
DIV+CSS布局图片加阴影效果方法转自:爱微网 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

关于div+css布局值得注意的地方

注意项

多次遇到的坑

关于div+css布局值得注意的地方相关推荐

最新文章

热门文章