css3设计模式,常用布局

html-css011

css3设计模式,常用布局,第1张

1.css3常用的布局有多栏布局、多列布局、弹性布局、流式布局、瀑布流布局和响应式布局。

2.float浮动布局,absolute绝对定位,flex弹性盒子,table表格布局,grid网格布局 / 栅格化布局

3.移动端布局:流式布局(百分比布局)JD,flex弹性布局(强烈推荐)携程,less+rem+媒体查询布局 苏宁,

css设计模式

OOCSS——Object Oriented CSS

SMACSS——Scalable and Modular Architecture for CSS

垂直水平均分:

子元素纵向等距排列:

总元素的宽度=宽度+左填充+右填充+左边框+右边框+左边距+右边距

IE盒子模型width=width(margin+padding) 解决IE8及更早版本不兼容问题可以在HTML页面声明 <!DOCTYPE html>即可。

1、bootstrap: http://www.bootcss.com/ 响应式布局

jquery weui https://jqweui.cn/components#form

jquery weui开发经验总结

2、css3 动画

http://www.haorooms.com/uploads/example/Animatecss/

更多框架

http://nec.netease.com/framework

3、icon字体

http://fontawesome.io/

http://www.iconfont.cn/

4、css的 SASS 和Less框架

vonic 框架

https://wangdahoo.github.io/vonic/docs/#/