CSS规范命名

    技术2022-05-11  61

      CSS命名对于网页的开发管理的重要性往往被人忽略,很多初学者认为,css命名没什么,就是个名字而已,随便根据自己的意愿写就行了,因

      为它对于网页的表现没有任何影响。可是有过网页制作和网站管理经验的人都会知道,css的命名对于网站的清晰和日后的管理很重要,初学者

      应该从一开始就学习和尊重这些规范,形成良好的代码编写习惯,对于以后网站的建设、维护和改造有着至关重要的影响。下面是作者列出的

      一些css常用的规范性命名,这些名字已经成了网页设计规范,在网页设计中我们应该遵循这些规范性的名字。站点:site首页:homepage导航:nav布局:layout搜索:search 网页头部:head/header 二级页面/子页面:subpage登录条:loginbar 侧栏:side/sidebar 广告:banner 子导航:subnav 当前位置导航:crumb菜单:menu 子菜单:submenu 滚动:scroll 下拉:drop表单:form箭头:arr/arrow下拉菜单:dropmenu主题/外观:theme页面主体:main 内容:content 标签页:tab 列表:list 工具条:tool/toolbar转角/圆角:cor/corner提示信息:msg 小技巧:tips 标题:title 特别的:spec资源:source加入:joinus 指南:guild 服务:service 热点:hot 新闻:news 下载:download 注册:regsiter 状态:status 按钮:btn 投票:vote 关于我们:aboutus网站地图:sitemap合作伙伴:partner 友情链接:friendlink 网页底部:foot/footer 版权:copyright提交:submit搜索框:searchbox文本框:textbox统计:count以上结构就可以组合使用,例如:左列标题lefttitle;底部导航footernav 

      规范不是说要所有人照一个样子来命名css,我们可以根据自己的需要定制命名规则,只要记住命名的规则,就可以根据网站本身的特点来创造具有自己风格的命名方式。   一、目前网页设计者用得较多的是基于软件开中变量的命名方式的命名方法。如对于一组用于定义字体样式的class,我们可以使用f即foot的头字母为前缀进行命名,如:   f-blue:表示蓝色字体样式  f-blod:表示粗体字体样式对于网页中如新闻频道的一些新闻的现实样式,可以用n作为前缀进行样式设计,如:  n-title:新闻标题  n-list:新闻列表  二、我们还可以将代表各个部分的名字组合起来使用,如 ,对于上面的例子,我们可以这样命名:fontBlue: 表示蓝色字体样式newsTitle:表示新闻列表  这样的命名方式同样清晰明了,为大多网页设计师所接受,只不过要特别注意大小写的区分,css中是区别大小写的.开始时容易出错,多加注意便可.  按照这样的一些命名方式,我们可以非常明确的知道css中的每一个class的用途,便于使用和设计、维护。想一想,你要想出很多名字来命名css也很麻烦的,是吧?

     

    最新回复(0)