Introduction to CSS Framwork
0 likes249 views
本文介绍了CSS框架的类型和优势，包括标准化、快速开发和统一样式。详细阐述了元素重置的重要性以及常见的网格布局系统，尤其是960网格系统的特性。文末列出了一些推荐的CSS框架和相关资源链接。
Introduction to CSS Framwork
- 1. 1st TechParty@UIC xingzhi CSS框架简介
- 2. 为什么要用css框架
- 3. 省事！
- 4. 1. 标准、规范、跨浏览器 2. 快速开发 3. 统一样式
- 9. /*reset.css from YUI*/ html{font: 12px/24px "微软雅黑","宋体","arial","Verdana";color: #000;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form, fieldset,legend,input,textarea,p,blockquote,th,td{margin:0; padding:0}table{border-collapse:collapse;border-spacing:0} fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th, var{font-style:normal;font-weight:normal}ol,ul{list-style:none} caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font- weight:normal}q:before,q:after{content:''}abbr,acronym{border:0; font-variant:normal}sup{vertical-align:text-top}sub{vertical- align:text-bottom}input,textarea,select{font-family:inherit;font- size:inherit;font-weight:inherit}input,textarea,select{*font- size:100%}legend{color:#000}a{text-decoration: none;}
- 10. 网格布局
- 11. 常见的网格系统： Blueprint: A CSS Grid Framework、 960 CSS Grid System、 Tripoli Framework、 YAML – Yet Another Multicolumn Layout、 YUI Grid CSS 等
- 12. 960 grid system
- 13. “ 960 Grid System的特性是将960像素的网 页分为12列的布局和16列布局。12列布局将 总宽分成12份，每份的宽度是60px，而16列 的布局分成16份，每份的宽度是40px，每部 分左右边距都是10px，从而每列产生20px的 空隙。”
- 14. 960.gs 首页示例
- 15. 页面宽度：960px 容器：container_12、container_16 网格：grid_N 去除外边距: alpha、omega 定位：push_N 、pull_N 占位：prefix_N 、suffix_N 清除浮动：clear
- 16. 讲代码。。。
- 17. 36 个 CSS 框架推荐http://www.oschina.net/news/22591/36-css- frameworks-for-designers 精选国外15个CSS框架 http://www.cnblogs.com/ywqu/archive/2009/08/24/1552635.html 栅格系统网站设计流程 http://www.ziluobo.com/960gs-use.html