`

css书写规范

 
阅读更多

连字符CSS选择器命名规范

1.长名称或词组可以使用中横线来为选择器命名。

2.不能用“_”下划线来命名CSS选择器,为什么呢?

  • 一些浏览器已经不允许使用下划线来命名CSS选择器(就是不兼容);
  • 能良好区分JavaScript变量命名.

underline

 

 

 

 

常用的CSS命名规则

头:header
内容:content/container
尾:footer
导航:nav
侧栏:sidebar
栏目:column
页面外围控制整体佈局宽度:wrapper
左右中:left right center
登录条:loginbar
标志:logo
广告:banner
页面主体:main
热点:hot
新闻:news
下载:download
子导航:subnav
菜单:menu
子菜单:submenu
搜索:search
友情链接:friendlink
页脚:footer
版权:copyright
滚动:scroll
内容:content
标签:tags
文章列表:list
提示信息:msg
小技巧:tips
栏目标题:title
加入:joinus
指南:guild
服务:service
注册:regsiter
状态:status
投票:vote
合作伙伴:partner

 

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

 

 

CSS样式表文件命名

主要的 master.css
模块 module.css
基本共用 base.css

 

 

分享到:
评论

相关推荐

    网页前端css书写规范

    网页前端CSS书写规范是前端开发中非常重要的一个环节,它直接关系到代码的可维护性、可读性和项目的整体风格统一性。一个良好的CSS书写规范不仅能够提升开发效率,还能优化网页加载速度,提高网站的用户体验。 首先...

    使用的CSS书写规范、顺序

    以下是对标题和描述中提到的CSS书写规范和顺序的详细说明: **CSS书写顺序:** 1. **位置属性**:首先设置元素的位置属性,包括`position`(定位模式),`top`、`right`、`bottom`、`left`(边缘距离),`z-index`...

    网页前端CSS书写规范

    ### 网页前端CSS书写规范详解 #### CSS书写顺序 在进行网页前端开发时,遵循一定的CSS属性书写顺序能够使代码更加清晰易读。一般推荐的书写顺序如下: 1. **位置属性**:包括`position`、`top`、`right`、`z-...

    css书写规范 web设计css

    ### CSS书写规范与Web设计标准 #### CSS书写规范概述 CSS(层叠样式表)是网页设计中的一个重要组成部分,用于定义HTML文档中的元素布局、颜色、字体等视觉表现形式。良好的CSS书写规范不仅可以提高代码的可读性...

    HTML页面CSS书写规范(大型网站统一规范)

    为了确保网站的美观性和一致性,制定一套统一的CSS书写规范至关重要。本篇文章将详细介绍《HTML页面CSS书写规范(大型网站统一规范)》中的各项要点,帮助前端工程师更好地理解和应用这些规范。 #### 二、结构说明 1...

    div+css书写规范

    【div+css书写规范】是前端开发中的一个重要概念,它涉及到网页布局和样式的组织方式。下面将详细讲解其中的知识点: 1. **文件命名规范**: - 全局样式:通常用`global.css`表示,包含通用的样式规则。 - 框架...

    OA-1-网页前端CSS书写规范.zip_css_peopledyh

    一个良好的CSS书写规范能够提高代码的可读性,便于团队协作,减少错误,并使得维护工作变得更加轻松。本资料"OA-1-网页前端CSS书写规范.zip"包含了对CSS编写规范的详细指南,特别是由peopledyh推荐的实践建议。 ...

    CSS命名规范CSS命名规范

    CSS 命名规范和 CSS 书写规范 一、CSS 命名规范 CSS 命名规范是指在编写 CSS 代码时,遵守一定的命名规则,以便于代码的阅读、维护和重用。下面是一些常用的 CSS 命名规范: * 文件命名规范:global.css、layout....

    CSS书写规范、顺序和命名规则

    这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的。 一、CSS书写顺序 1.位置属性(position, top, right, z-...二、CSS书写规范 1.使用CSS缩写属性 CSS有些属性是可以缩写的,

    web开发中怎么样使css书写规范?

    以下是一些核心的CSS书写规范: 1. **外部引用CSS样式表**: 为了优化网页加载速度,应尽量将CSS样式放在外部文件中,而不是内联或在HTML头部使用`<style>`标签。这样可以实现样式和结构的分离,提高页面加载效率...

    css命名及书写规范.rar

    二、CSS书写规范 1. **缩进与空格**:保持一致的缩进,通常使用2个或4个空格,以增加代码可读性。 2. **换行与逗号分隔**:每行只定义一个规则,逗号后添加空格,如:`.class1, .class2 { ... }`。 3. **属性顺序...

    css规范文档

    5. **CSS书写规范**: - CSS文件命名应明确,描述其功能,如模块名。 - CSS选择器应简洁,避免过于复杂的层级关系。 - 使用CSS预处理器如Sass或Less,提高代码复用和组织性。 - 为提高页面加载速度,将不常改变...

    WEB前端开发规范文档+CSS命名规范

    ### CSS书写规范 这部分未在描述中具体给出,但通常包括以下几点: 1. **命名规则**:使用有意义的英文单词或缩写,保持一致的命名风格,如BEM(Block Element Modifier)或SMACSS(Scalable and Modular ...

    CSS代码规范.pdf

    3. **CSS书写规范** - 用两个空格缩进,不用tab键。 - 自闭合元素如`<img>`不应有斜线。 - 不要省略元素的结束标签,如`<p>`。 - 属性值应使用双引号,例如:`class="example"`。 - HTML根元素应指定lang属性,...

Global site tag (gtag.js) - Google Analytics