七、css优化
优化目的
1.减少用户端压力
2.提升用户体验
1.css优化的原则
尽量减少http的请求个数(缓存,精灵图)
在页面的顶部引入js和css文件
将css和js文件放到单独文件中
2.css代码的优化
合并样式(能写群组,能用简写)
缩小样式文件(能重用就重用)
避免出现空的href和src=""
代码压缩
八、css reset(css样式清零) 和 normalize.css
不同浏览器默认样式不同,为了一份代码在各个浏览器样式统一
我们把不同浏览器的默认样式统一的修改或者清零
1.css reset 十分暴力把很多元素特有样式都清零
导致这些元素失去了原本的意义
2.Normalize.css
保留了很多元素的语义特征,优化了不同浏览器的很多bug
css reset的替代方案
BootStrap
一、响应式的布局(是css3 2010年提出)
1.声明是响应式布局
Responsive web page 响应式/自适应网页
可以根据浏览器设备不同,而自动改变页面的布局,图片,文字效果
不影响用户体验
2响应式网页必须做的几件事
1.布局的时候不能有固定的元素宽度,必须是流式布局(默认文档流+float)
2.文字和图片大小随着容器大小变化(相对单位% rem)
3.媒体查询技术(css3提供的技术)
3.如何测试响应式网页
①使用真实设备
测试效果真实可靠
②使用第三方模拟软件
不要太多真实设备,测试比较方便
测试效果有限
③使用chrome自带的模拟软件
简单方便
测试效果十分有限<