CSS布局口诀 - CSS BUG顺口溜

原创 2011年01月23日 13:37:00

在进行CSS网页布局时遇到BUG,请认真阅读以下内容,非常容易记忆的,不知道哪位高人把CSS BUG编成了顺口溜了!看看好不好记住呢?

一、IE边框若显若无,须注意,定是高度设置已忘记;

二、浮动产生有缘故,若要父层包含住,紧跟浮动要清除,容器自然显其中;

三、三像素文本慢移不必慌,高度设置帮你忙;

四、兼容各个浏览须注意,默认设置行高可能是杀手;

五、独立清除浮动须铭记,行高设无,高设零,设计效果兼浏览;

六、学布局须思路,路随布局原理自然直,轻松驾驭html,流水布局少hack,代码清爽,兼容好,友好引擎喜欢迎。

七、所有标签皆有源,只是默认各不同,span是无极,无极生两仪—内联和块级,img较特殊,但也遵法理,其他只是改造各不同,一个*号全归原,层叠样式理须多练习,万物皆规律。

八、图片链接排版须小心,图片链接文字链接若对齐,padding和vertical-align:middle要设定,虽差微细倒无妨。

九、IE浮动双边距,请用display:inline拘。

十、列表横向排版,列表代码须紧靠,空隙自消须铭记。

CSS中常见的BUG调试

1、布局——layout 布局是windows提出的概念,用于控制元素的尺寸和定位。拥有布局的元素负责自身及其子元素的尺寸及定位,而没有布局的元素只能依靠最近的祖先元素进行控制。 通常在IE6中出...
  • cy012124
  • cy012124
  • 2014年09月17日 11:12
  • 953

各种主流浏览器CSS、BUG兼容(附带解决方法~、)

1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了。缺点是要控制内容不...
  • MelodyFreedom
  • MelodyFreedom
  • 2016年05月30日 15:20
  • 1698

CSS各种常用布局

三列布局自适应,高度占满 注意高度占满用100%时要对html和body先设置height:100%;因为每个元素的100%都是取决于父元素相同属性值。 宽度自适可以使用flex或width使用33....
  • mzzzzq
  • mzzzzq
  • 2016年04月22日 11:17
  • 2656

css的3种布局方式

1.文档流布局方式,这是最基本的布局方式,就是按照文档顺序一个一个地显示,块元素独占一行,内联元素共享一行。 2.浮动布局方式,某个元素浮动之后,其后面的元素就当其不存在而占用其原来的地方,按照原来文...
  • xxssyyyyssxx
  • xxssyyyyssxx
  • 2015年10月14日 20:18
  • 2628

css-水平和垂直布局

1. 盒子模型margin外边距,border边框,padding内边距,element元素2. 水平布局2.1 盒子模型理解水平布局父元素width=子元素margin-left+border-le...
  • github_34514750
  • github_34514750
  • 2016年04月02日 17:06
  • 1999

css中邮件布局问题

css中邮件使用table布局,而且样式都写在style里。td里可以逃入table,而tr里必须是td,th。邮件中的width一般使用的是600px。     考虑到兼容性问题,间距用td控制,...
  • xiaoxiao_xiaoliu
  • xiaoxiao_xiaoliu
  • 2014年09月18日 08:36
  • 728

css sticky footer布局+流式布局

css sticky footer布局参考地址:张鑫旭老师-css sticky footer布局 结合项目具体场景给出介绍:点击信息,弹出浮层,显示详细信息。浮层最下面有个关闭按钮,一直处在底部,...
  • u013217071
  • u013217071
  • 2017年06月06日 10:35
  • 706

CSS布局与定位,flow流,float

块元素的位置:从上向下流,元素之间自动换行 内联元素的位置:水平方向上排列,总体上会从左上方流向右下方...
  • chq11106004389
  • chq11106004389
  • 2016年01月02日 12:36
  • 1110

CSS布局模型(一)——流动模型

css布局模型 CSS包含3种基本的布局模型,用英文概括为:Flow、Layer 和 Float。 在网页中,元素有三种布局模型: 1、流动模型(Flow) 2、浮动模型 (Flo...
  • u010486124
  • u010486124
  • 2015年02月07日 17:07
  • 1066

CSS基础知识-五(CSS定位、左右布局方法)

一、CSS定位 1、Float:left / right /none;------左浮动/右浮动/无 2、Position:absolute;----绝对定位 3、Position:relative;...
  • u012054869
  • u012054869
  • 2016年05月31日 20:12
  • 1265
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:CSS布局口诀 - CSS BUG顺口溜
举报原因:
原因补充:

(最多只允许输入30个字)