`
peng5262525
  • 浏览: 4238 次
最近访客 更多访客>>
社区版块
存档分类
最新评论

HTML,CSS的命名的习惯总结

阅读更多
CSS命名规则
头:header
内容:content/containe
尾:footer
导航:nav
侧栏:sidebar
栏目:column
页面外围控制整体布局宽度:wrapper
左右中:left right center
登录条:loginbar
标志:logo
广告:banner
页面主体:main
热点:hot
新闻:news
下载:download
子导航:subnav
菜单:menu
子菜单:submenu
搜索:search
友情链接:friendlink
页脚:footer
版权:copyright
滚动:scroll
内容:content
标签页:tab
文章列表:list
提示信息:msg
小技巧:tips
栏目标题:title
加入:joinus
指南:guild
服务:service
注册:regsiter
状态:status
投票:vote
合作伙伴:partner
XHTML文件中id的命名
(1)页面结构
容器: container
页头:header
内容:content/container
页面主体:main
页尾:footer
导航:nav
侧栏:sidebar
栏目:column
页面外围控制整体布局宽度:wrapper
左右中:left right center
(2)导航
导航:nav
主导航:mainbav
子导航:subnav
顶导航:topnav
边导航:sidebar
左导航:leftsidebar
右导航:rightsidebar
菜单:menu
子菜单:submenu
标题: title
摘要: summary
(3)功能
标志:logo
广告:banner
登陆:login
登录条:loginbar
注册:regsiter
搜索:search
功能区:shop
标题:title
加入:joinus
状态:status
按钮:btn
滚动:scroll
标签页:tab
文章列表:list
提示信息:msg
当前的: current
小技巧:tips
图标: icon
注释:note
指南:guild
服务:service
热点:hot
新闻:news
下载:download
投票:vote
合作伙伴:partner
友情链接:link
版权:copyright
XHTML文件中class的命名
(1)颜色:使用颜色的名称或者16进制代码,如(不建议以表现来命名)
.red { color: red; }
.f60 { color: #f60; }
.ff8600 { color: #ff8600; }
(2)字体大小,直接使用"font+字体大小"作为名称,如
.font12px { font-size: 12px; }
.font9pt {font-size: 9pt; }
(3)对齐样式,使用对齐目标的英文名称,如
.left { float:left; }
.bottom { float:bottom; }
(4)标题栏样式,使用"类别+功能"的方式命名,如
.barnews { }
.barproduct { }
其它相关注意事项
1.一律小写;
2.尽量用英文;
3.不加中杠和下划线;
4.尽量不缩写,除非一看就明白的单词.
主要的 master.css
模块 module.css
基本共用 base.css
布局,版面 layout.css
主题 themes.css
专栏 columns.css
文字 font.css
表单 forms.css
补丁 mend.css
打印 print.css
分享到:
评论

相关推荐

    HTML,CSS的命名的习惯总结..

    HTML,CSS的命名HTML,CSS的命名的习惯总结..的习惯总结..

    HTML,CSS的命名习惯总结

    HTML,CSS的命名习惯总结,网页前端开发的朋友可以参考下,利于别人阅读代码。

    CSS网站布局实录 (第二版)PDF版

    6.3 CSS选择符的命名 6.3.1 大小写敏感 6.3.2 合法字符及组合 6.3.3 命名建议 6.4 CSS文件结构设计与优化 6.4.1 导入结构 6.4.2 结构优化 6.5 使用CSS缩写 6.5.1 font字体缩写 6.5.2 margin与padding边距缩写 6.5.3 ...

    一个简单的网页设计HTML5作业.docx

    (2)采用HTML结构标记(或div标记)+CSS进行整体布局定位。(5分) (3)网站首页栏目数量不能少于3个,各栏目要能正确链接到相应栏目子页面,同时各栏目页面也能正确返回到网站首页。(3分) (4)网站页面标题...

    网页设计作业-HTML5作业

    (2)采用HTML结构标记(或div标记)+CSS进行整体布局定位。 (3)网站首页栏目数量不能少于3个,各栏目要能正确链接到相应栏目子页面,同时各栏目页面也能正确返回到网站首页。 (4)网站页面标题、图片图标等要...

    编写高质量代码-Web前端开发修炼之道.azw3

    4.4.2 CSS的命名——命名空间的概念 4.4.3 挂多个class还是新建class——多用组合,少用继承 4.4.4 如何处理上下margin 4.5 低权重原则——避免滥用子选择器 4.6 CSS sprite 4.7 CSS的常见问题 4.7.1 CSS的...

    网页设计期末:茶文化网站

    (2)采用HTML结构标记(或div标记)+CSS进行整体布局定位。(5分) (3)网站首页栏目数量不能少于3个,各栏目要能正确链接到相应栏目子页面,同时各栏目页面也能正确返回到网站首页。(3分) (4)网站页面标题、...

    shop-anywhere:使用ReactJS和Redux的电子商务网站

    在任何地方购物 这是一个电子商务网站,我使用JavaScript和React概念...CSS好习惯 基于BEMCSS命名约定 使用SCSS 将flex样式添加为mixin以重复使用 注意:-我从一些网站上删除了一些图像,仅在本网站中用于学习目的。

    hugo_twcss:Hugo静态站点生成器(SSG)的入门套件。 回购以前被命名为“ hugo_site_css-grid”。

    雨果入门套装 这是基于我的网站的外观的。 注意:此仓库不使用。 请参阅。 如何使用 将此复制到本地存储库。 对config.yaml进行适当的...对于不习惯使用插件和依赖项中JavaScript的Hugo用户而言,此存储库可能不是您

    clean-up-homework

    我开发此项目的动机和目的是提高我的编码技能,并帮助我养成基本的习惯,其中的一种是创建干净,合乎逻辑的代码行,因此,如果需要更改,我将更容易进行更改。 这也是为了使代码行更容易向不熟悉编码的人解释。 ...

    NETSNS社交系统 v1.5.1 bulid 081209 源码版.rar

    多种生成文件命名形式可供选择,自定义文件存放路径,您可以随心所欲的设置要生成的扩展名,一切更可能的根据您的喜好DIY。动态访问可支持伪静态,增强Url友好性,方便搜索引擎的收录。 自定义菜单、快捷方式,维护...

    NetCMS 1.7.0 Build 1125.rar

    多种生成文件命名形式可供选择,自定义文件存放路径,您可以随心所欲的设置要生成的扩展名,一切更可能的根据您的喜好DIY。动态访问可支持伪静态,增强Url友好性,方便搜索引擎的收录。 自定义菜单、快捷方式,...

    inKLing:给你的样式表一个线索

    首先,它将让您熟悉较新的 HTML5 元素,因为建议的类在这些命名约定内工作。 此外,它可能会强制执行非常干净的标记,因为某些事情在其他情况下看起来根本不正确。 我们为什么这样做? 为快速原型设计创建复杂框架...

    单页面和多页面开发及应用

    -如有造成Css命名冲突。 解决办法:我们可以使用Sass、LESS和Stylus等CSS预处理器,在一定程度上可以解决该问题。 -前进、后退、地址栏、书签等,都需要程序进行管理,页面的复杂度很高,需要一定的技能水平和开发...

    NetCMS_Ver1.0

    多种生成文件命名形式可供选择,自定义文件存放路径,您可以随心所欲的设置要生成的扩展名,一切更可能的根据您的喜好DIY。动态访问可支持伪静态,增强Url友好性,方便搜索引擎的收录。 <br>自定义菜单、快捷方式...

    NETCMSv1.5(Build0509)完整源码版

    多种生成文件命名形式可供选择,自定义文件存放路径,您可以随心所欲的设置要生成的扩展名,一切更可能的根据您的喜好DIY。动态访问可支持伪静态,增强Url友好性,方便搜索引擎的收录。 <br>自定义菜单、快捷方式...

    ASP.NET3.5从入门到精通

    2.3.1 命名规则和命名习惯 2.3.2 声明并初始化变量 2.3.3 数组 2.3.4 声明并初始化字符串 2.3.5 操作字符串 2.3.6 创建和使用常量 2.3.7 创建并使用枚举 2.3.8 类型转换 2.4 编写表达式 2.4.1 表达式和运算符 2.4.2 ...

    ASP.NET 3.5 开发大全11-15

    2.3.1 命名规则和命名习惯 2.3.2 声明并初始化变量 2.3.3 数组 2.3.4 声明并初始化字符串 2.3.5 操作字符串 2.3.6 创建和使用常量 2.3.7 创建并使用枚举 2.3.8 类型转换 2.4 编写表达式 2.4.1 表达式和运算符 2.4.2 ...

    ASP.NET 3.5 开发大全

    2.3.1 命名规则和命名习惯 2.3.2 声明并初始化变量 2.3.3 数组 2.3.4 声明并初始化字符串 2.3.5 操作字符串 2.3.6 创建和使用常量 2.3.7 创建并使用枚举 2.3.8 类型转换 2.4 编写表达式 2.4.1 表达式和运算符 2.4.2 ...

Global site tag (gtag.js) - Google Analytics