您现在的位置是：网站首页> 编程资料编程资料

div css布局解决浏览器兼容及优化等实用技巧网页图片优化工具及使用技巧分享使用css sprites来优化你的网站在Retina屏幕下显示实现原理与代码css sprites技术 CSS Sprites图片切割术与图片优化深入理解网页设计中的CSS Sprites技术介绍及其优化方法CSS常用优化技巧CSS 网站性能优化笔记有利于SEO优化的DIV+CSS的命名规则小结 CSS Expression 优化CSS Sprite优化减少HTTP链接数HTML优化加快网页速度

2021-08-29 2001人已围观

简介本文整理了一些在div+css 布局过程中的一些经验技巧如：浏览器兼容、规范写法、简写等一系列，需要的朋友可以参考下

DIV 上下居中用 line-height
Html代码

复制代码

代码如下:

垂直居中

清除浏览器默认样式
1.用其他有名的库来清除（如：YUI)
2.自已清除如：
* {padding: 0;margin:0;}

让A支持所有浏览器
Html代码

复制代码

代码如下:

捷道数码

Google

A 伪类定义顺序记忆法
LoVe:HAte(爱恨)
IMG vertical-align
vertical-align : auto | baseline | sub | super | top | text-top | middle | bottom | text-bottom | length
baseline :默认值。将支持 valign 特性的对象的内容与基线对齐
sub 垂直对齐文本的下标
super 垂直对齐文本的上标
top : 将支持 valign 特性的对象的内容对象顶端对齐
text-top : 将支持 valign 特性的对象的文本与对象顶端对齐
middle : 将支持 valign 特性的对象的内容与对象中部对齐
bottom : 将支持 valign 特性的对象的内容与对象底端对齐
text-bottom : 将支持 valign 特性的对象的文本与对象顶端对齐
length : 由浮点数字和单位标识符组成的长度值 | 百分数。可为负数。定义由基线算起的偏移量。基线对于数值来说为0，对于百分数来说就是0%。请参阅长度单位。目前IE尚未实现此参数
Html代码　

复制代码

代码如下:

正常

有图片有字

垂直Margin 叠加
Html代码

复制代码

代码如下:

div1

div2

span1span2

Background position
Html代码

复制代码

代码如下:

20px

20%

Float 占地问题
1.父子TAG都Float以父能包含子
Html代码

复制代码

代码如下:

child

Html代码

复制代码

代码如下:

child

2.最后一个子TAG后加一clear的无语义tag
Html代码

复制代码

代码如下:

child

例子7:
Html代码

复制代码

代码如下:

child

上一篇：css选择器(selector) xPath的选择器CSS selector:div.title p代表的是什么意思(通俗易懂)css教程:css指令,兼容,注释,selector-CSS教程-网页制作-网页教学网CSS Hack整理-CSS教程-网页制作-网页教学网CSS 学习笔记之CSS Selector

下一篇：css 细线表格 css制作table细线表格常用属性table表格的一些常用属性介绍div style常用属性介绍及使用示例frameset(划分框窗)常用属性整理CSS的部分常用属性整理DHTML 对象(各种 HTML 对象常用属性)CSS常用属性缩写实例-CSS教程-网页制作-网页教学网CSS常用属性的代码简化实例-CSS教程-网页制作-网页教学网DIV常用属性大全自己整理

您现在的位置是：网站首页> 编程资料编程资料

相关内容

点击排行

本栏推荐

猜你喜欢