admin 管理员组文章数量: 887021
2024年2月23日发(作者：hiring manager)
〈!DOCTYPE html〉
〈meta charset= ”UTF-8"> 〈title>标题 〈/head〉 〈body〉 注释:/*header start*/ 内容区域 /＊header end*/ 1、用两个空格代替 tab 键. 2、不要在自闭合的元素尾部添加斜线。不要省略可选的结束标签。 3、对于属性的定义，确保全部用双引号,不要用单引号。 4、指定HTML 的根元素的lang 属性。 5、IE 通过指定 edge mode 。通知 IE 采用其所支持的最新模式. 列： ”x— UA-Compatible ”content= ”IE=Edge，chrome=1 ”> 6、必须声明字符编码，一般采用 UTF-8 。 7、引入 CSS 与 JS 时不指定 type 属性, 因为它们都有默认值。 8、属性顺序： 8 。1 class 8.2 Id、name 8 。3 data—* 8 。4 src、for、type、href 8.5 title、alt 8.6 aria—*、role 9、书写顺序： 9.1 位置属性(position，top，right，z-index,display，float 等) 9 。2 大小(width,height，padding，margin) 9 。3 文字系列(font，line—height,letter—spacing，color—text-algin 等) 9.4 背景(background,border 等) 9 。5 其他(animation,transition 等) 10、尽量缩写属性. 11、去掉小数点前的“0 ”。 12、不建议使用下划线,为了和js 区分， IE6 中无效而且输入的时候少按 shift 键. 13、不要随意使用 id (应按需要使用，而不能滥用) 14、减少标签数量。 15、尽量避免使用js 生成标签。通过js 生成的标签让内容变得不易查找,编辑，并且降低性能。 16、对于从逗号分隔的属性值，每个逗号后面都应该插入一个空格(， box_shadow ) 。 17、不要在rgb( ) ,rgba ( )， hsl ( ) ，hsla ( ) 或 rect ( )值的内容逗号后插入空名(只要逗号,不加空格) . 18、十六进制全部小写(#fff)，尽量简写 . 19、为选择器中的属性添加双引号(input[type="text ”]) . 20、避免为 0 值指定单位.如 margin:0； 21、不要用 @import ，会增加额外的请求次数。应用一下代替： 21 。1 使用多个〈link〉 21.2 通过 sass 或 less 将多个 css 文件编译为一个文件。 21 3 。 通过 Rails ，Jekyll 或其他系统提供过 css 文件合并功能。 22、媒体查询应放在尽可能相关规则的附近，不要将他们打包放在一个单一的样式文件中 . 23、带前缀的属性，通过缩减方式,让每个属性的值在垂直方向对齐。 列： .div{ -webkit-box—shadow ：10px 10px 5px ＃888; box-shadow：10px 10px 5px #888； } 24、对于只包含一条声明语句的样式,建议语句放在同一行. 25、将最近的父class 或基本(base ) class 作为新 class 的前缀. 26、在文件的结尾添加一个空白行。 27、对为选择器分组时，将单独的选择器单独放在一行。 28、选择器的个数尽量不要超过 3 个。 29、每一条规则的大括号 { 前后加空格。 30、如果使用 CSS3 的属性,如果有必要加入浏览器前缀，则按照webkit- / -moz- / —ms- / —o— / std 的顺序进行添加，标准属性写在最后，并且 属性名称要对齐。 31、命名中尽量使用小写。 32、命名避免使用中文拼音，应该采用更简明有语义的英文单词进行组合 . 33、避免 class 与 id 重名。 1、添加了!important 的属性. 2、Style 属性嵌入。 3、具有一个或多个 id 选择器。 4、具有一个或多个类，属性或伪类选择器。 5、具有一个或多个元素选择器。 6、通配选择器。 7、优先级由高到低排列的 6 个位置。 7 。1 最高优先级的位置是 HTML 文档头部的〈style〉元素. 7 。2 style 元素中＠import 语句所导入的样式表。 7.3 〈link〉元素。 7 。4 〈link>样式表中的@import 语句导入的。 7.5 第五优先级的位置是最终用户附加的样式表。 7.6 最低是浏览器默认样式表。 全局样式： global 。css/base 。css 框架布局： 字体样式： 链接样式:link 。css 专栏： columns 。css 打印样式:print 。css 主题:themes。css 补丁:mend 。css 主要的:master。css 表单： forms 。css 清除浏览器样式： 模块： ] 清除浏览器部分样式: 私有： style。css 页头:header 整体页面:wrapper/container/page 页尾： footer 导航:nav 容器背景:containerbg 内容： content 子导航:subnav 菜单： menu 面包屑： breadcrumb菜单内容:menucontent 返回:back 子菜单： submenu 返回顶部： back-top子菜单内容:submenucontent 图标： icon 登录:login 登录条： loginbar 滚动:scroll 左中右： left,center,right搜索： search 标签页： tag 搜索关键字:keyword 标签内容： tagcontent搜索范围:range 当前标签： tagcurrent 标志 logo 当前位置： currentpath 标题:title 列表： list 侧栏： sidebar 图片列表:piclist 小技巧:tips 提示信息:mes/message广告:banner 加入： joinus 报头： masthead 指南： guild 左浮动图片： leftphoto 状态： status 按钮： btn 右浮动图片:rightphoto 服务： service 合作伙伴： partner 服务连接： servicelink 友情链接:friendlink 热点:hot 版权:copyright 新闻： news 投票:vote 下载 download 提交： submit 注册:regsiter 文本框:textbox 摘要:summary 统计： count 指南： guild 更多： extended/more 栏目： column 注释:note 条目底端： entrybottom 线:line 上一页： prev 图片： pic 下一页:next 当前： current 网站地图： sitemap 圆角:cor/corner 价格： price 结果:result 示例:example 小贴士:tip 数字： figure 插图： illustration 清单:listing 关于我们:about-as 正文:body 产品:products 警告： warning 功能区： shop (如购物车) 第一节： section-one 导入:lead—in
版权声明：本文标题：CSS代码规范 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.freenas.com.cn/jishu/1708638497h528434.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论