css书写顺序和常用命名推荐】的更多相关文章

写代码的时候有一个好的规范和顺序能够帮你节省很多时间.下文将推荐相关CSS书写顺序和规范的一些方法.这个文档将会整理进前端规范文档中,如果你有更好的意见,不妨留言告知我们. CSS书写顺序 该代码来自于互联网,最初好像是Mozilla的网站上. 1. Display & Flow(显示与流) 2. Positioning(位置) 3. Dimensions(尺寸) 4. Padding, Borders,Margins,Outline(填充.边界.边缘.轮廓) 5. Typographic St…
CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, margin, padding)3.文字系列(font, line-height, letter-spacing, color, text-align等)4.背景(background, border等)5.其他(animation, transition等)…
书写顺序 (1)定位属性:position  display  float  left  top  right  bottom   overflow  clear   z-index (2)自身属性:width  height  padding  border  margin   background (3)文字样式:font-family   font-size   font-style   font-weight   font-varient   color    (4)文本属性:text-…
属性书写顺序 [建议] 同一 rule set 下的属性在书写时,应按功能进行分组,并以 Formatting Model(布局方式.位置) > Box Model(尺寸) > Typographic(文本相关) > Visual(视觉效果) 的顺序书写,以提高代码的可读性. 解释: Formatting Model 相关属性包括:position / top / right / bottom / left / float / display / overflow 等 Box Model…
//显示属性 display list-style position float clear //自身属性 width height margin padding border background //文本属性 color font text-decoration text-align vertical-align white-space other text content 扩展阅读:Mozilla suggested css order…
//显示属性displaylist-stylepositionfloatclear //自身属性widthheightmarginpaddingborderbackground //文本属性colorfonttext-decorationtext-alignvertical-alignwhite-spaceother textcontent 源文件在这里:Mozilla suggested css order 内容如下: /* mozilla.org Base Styles * maintain…
关于CSS的书写规范和顺序,是大部分前端er都必须要攻克的一门关卡,如果没有按照良好的CSS书写规范来写CSS代码,会影响代码的阅读体验.这里总结了一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. CSS书写顺序 1.位置属性  (position, top, right, z-index, display, float等) 2.大小  (width, height, padding, margin) 3.…
一.css顺序 首先声明,浏览器读取css的方式是从上到下的.我们一般书写css只要元素具备这些属性就会达到我们预期的效果,但是这会给以后的维护和浏览器的渲染效率带来一定的影响,那么该怎么书写css的顺序呢?有没有一定的规范呢? 首先我们知道css的属性按特性分为几类: 1.规定元素特性,如display.position.float,这些属性会决定他的排版方式 2.规定元素的空间占据,如line-height.margin.padding.width.height等,这些属性会决定元素的大小和…
传说中的Mozilla推荐 /* mozilla.org Base Styles * maintained by fantasai */ /* Suggested order: * display * list-style * position * float * clear * width * height * margin * padding * border * background * color * font * text-decoration * text-align * verti…
1.常用命名 标题: title 摘要: summary 箭头: arrow 商标: label 网站标志: logo 转角/圆角: corner 横幅广告: banner 子菜单: subMenu 搜索:search 搜索框: searchBox 登录: login 登录条:loginbar 工具条: toolbar 下拉: drop 标签页: tab 当前的: current 列表: list 滚动:scroll 服务: service 提示信息: msg 热点:hot 新闻: news 小…
写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line-heig…
@设计达人网 写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里我总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, lin…
写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考   这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. 一.CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-he…
转自:http://www.admin10000.com/document/2979.html 写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width,…
/* mozilla.org Base Styles * maintained by fantasai */ /* Suggested order: * display * list-style * position * float * clear * width * height * margin * padding * border * background * color * font * text-decoration * text-align * vertical-align * wh…
写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line-heig…
CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-height, letter-spacing, color- text-align等)4.背景(background, border等)5.其他(animation, transition等) CSS书写规范 使用CSS缩写属性 CSS有些属性是可以缩写的,比如pad…
写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line-height…
原文地址 写了这么久的Css,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. 一.CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-h…
写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line-heig…
CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line-height, letter-spacing, color- text-align等) 4.背景(background, border等) 5.其他(animation, transition等) 使用CSS缩写属性 CSS有些属性是可以缩写的,比如padding…
记得刚开始学习前端的时候,每次写css样式都是用到什么就在样式表后添加什么,完全没有考虑到样式属性的书写顺序对网页加载代码的影响.后来逐渐才知道正确的样式顺序不仅易于查看,并且也属于css样式优化的一种方式.那么是怎么个顺序呢? (1)定位属性:position  display  float  left  top  right  bottom   overflow  clear   z-index (2)自身属性:width  height  padding  border  margin …
刚开始学习前端的时候,每次写css样式都是用到什么就在样式表后添加什么,完全没有考虑到样式属性的书写顺序对网页加载代码的影响.后来逐渐才知道正确的样式顺序不仅易于查看,并且也属于css样式优化的一种方式.那么是怎么个顺序呢? (1)定位属性:position  display  float  left  top  right  bottom   overflow  clear   z-index (2)自身属性:width  height  padding  border  margin (3)…
记得刚开始学习前端的时候,每次写css样式都是用到什么就在样式表后添加什么,完全没有考虑到样式属性的书写顺序对网页加载代码的影响.后来逐渐才知道正确的样式顺序不仅易于查看,并且也属于css样式优化的一种方式.那么是怎么个顺序呢? (1)定位属性:position  display  float  left  top  right  bottom   overflow  clear   z-index (2)自身属性:width  height  padding  border  margin …
HTML 规范 分离的标记.样式和脚本 结构.表现.行为分离 在可能情况下验证你的标记 使用编辑器验证你的标记是否正确,一般编辑器都自带有这个功能. 技术不支持的时候使用备胎,如canvas 编码格式:使用UTF-8 语义性 对于HTML5而言,例如header.footer.nav.section等跟div能实现的功能基本类似,但是语义性上有着天壤之别. TODO待定项 尚未实现的或待定的内容一定要标识强调出来,利用TODO辨识,而非其他诸如@@来强调. 在todo项中如果有必要列明联系人,比…
一.CSS书写顺序 1.位置属性(position,top,right,z-index,display,float等) 2.大小(width,height,padding,margin) 3.文字系列(font,line-height,letter-spacing,color-text-align等) 4.背景(background,border等) 5.其他(animation,transition等) 二.CSS书写规范 1.使用CSS缩写属性 CSS有些属性是可以缩写的,比如padding…
1.CSS书写顺序: (1)位置:position.top.right.z-index.display.float (2)大小:width.height.padding.margin (3)文字系列:font.line-height.letter-space.color.text-align (4)背景:background.border (5)其他:animate.transition 2.一些特殊字体样式: 首行缩进2字符:{text-indent:2em;} 水平居中:{text-alig…
网易CSS框架NEC:http://nec.netease.com/ NEC框架的CSS规范:  CSS规范 - 分类方法 CSS规范 - 命名规则 CSS规范 - 代码格式 CSS规范 - 优化方案 CSS规范 - 最佳实践 CSS规范 - 典型错误 NEC - 代码库 NEC - 案例 统一语义理解和命名 布局(.g-) 语义 命名 简写 文档 doc doc 头部 head hd 主体 body bd 尾部 foot ft 主栏 main mn 主栏子容器 mainc mnc ( c 表示…
CSS命名规则 头:header 内容:content/containe 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center 登录条:loginbar 标志:logo 广告:banner 页面主体:main 热点:hot 新闻:news 下载:download 子导航:subnav 菜单:menu 子菜单:submenu 搜索:search 友情链接:friendlink 页脚:foote…
在前端开发中,规范使用 DIV+CSS 命名,可以增强团队合作提高开发效率,有利于页面后期的维护和优化. 1.页面结构 wrap:外套.包裹,用于最外层. wrapper:外套,用于页面外围控制整体布局宽度. box:盒子,容器. header:头部,用于页头部分. nav:导航,主导航. main:主要区域,内容主体. content/container:内容,内容容器. sidebar:侧边栏. footer:底部,用于页脚部分. 2.功能区块 left center right:左中右.…