网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容如下:
页头:header 如:#header{属性:属性值;}或.header{属性:属性值;},也许你需要了解class与id区别及用法
登录条:loginBar 标志:logo 侧栏:sideBar
广告:banner 导航:nav 子导航:subNav
菜单:menu 子菜单:subMenu 搜索:search
滚动:scroll 页面主体:main 内容:content
标签页:tab 文章列表:list 提示信息:msg
小技巧:tips 栏目标题:title 加入:joinus
指南:guild 服务:service 热点:hot
新闻:news 下载:download 注册:regsiter
状态:status 按钮:btn 投票:vote
合作伙伴:partner 友情链接:friendLink 页脚:footer
版权:copyRight
常用配合标签div、h1、h2、h3、h4、span、em、b、strong、font、u
1.CSS的 ID 的命名 也许你需要了解class与Id区别
外 套:wrap 主导航:mainNav 子导航:subnav
页 脚:footer 整个页面:content 页 眉:header
版 权:copyRight 商 标:label 标 题:title
主导航:mainNav(globalNav) 顶导航:topnav
边导航:sidebar 左导航:leftsideBar 右导航:rightsideBar
旗 志:logo 标 语:banner 菜单内容1: menu1Content
菜单容量: menuContainer 子菜单: submenu
边导航图标:sidebarIcon 注释: note
面包屑:breadCrumb(即页面所处位置导航提示)
容器:container 内容:content 搜索:search
登陆:login 功能区: shop(如购物车,收银台)
当前:current
DIV+CSS命名小结:无论是使用“.”(小写句号)选择符号开头命名,还是使用“#”(井号)选择符号开头命名都无所谓,但我们最好遵循,主要的、重要的、特殊的、最外层的盒子用“#”(井号)选择符号开头命名,其它都用“.”(小写句号)选择符号开头命名,同时考虑命名的CSS选择器在HTML中重复使用调用。
通常我们最常用主要命名有:wrap(外套、最外层)、header(页眉、头部)、nav(导航条)、menu(菜单)、title(栏目标题、一般配合h1h2h3h4标签使用)
、content (内容区)、footer(页脚、底部)、logo(标志、可以配合h1标签使用)、banner(广告条,一般在顶部)、copyRight(版权)。其它可根据自己需要选择性使用。
DIVCSS5建议:主要的、重要的、最外层的盒子用“#”(井号)选择符号开头命名,其它都用“.”(小写句号)选择符号开头命名。
2.CSS样式文件命名如下
主要的 master.css
布局,版面 layout.css
专栏 columns.css
文字 font.css
打印样式 print.css
主题 themes.css
也许你需要了解一下css引用到html方法
以上为DIV+CSS的命名规则总结,相信通过规范的CSS命名给你以后网站网页的维护带来方便。
网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容如下:的更多相关文章
- 普通企业的规划类项目中,OptaPlanner更适合作为APS的规划优化引擎
在企业的规划.优化场景中,均需要开发规划类的项目,实现从从种可能方案中找出相对最优方案.如排班.生产计划(包括高层次的供应链优化,到细粒度的车间甚至机台作业指令).车辆调度等.因为这类场景需要解决的问 ...
- 学习网页制作中如何在正确选取和使用 CSS 单位
在 CSS 测量系统中,有好几种单位,如像素.百分比.英寸.厘米等等,Web 开发人员很难了解哪些单位在何处使用,如何使用.很多人习惯了总是使用同一种单位,但这一决定可能会严重限制你的设计的执行. 这 ...
- 《SEO在网页制作中的应用》视频笔记
学习了慕课网<SEO在网页制作中的应用>视频,今天将里面的知识整理一下. 一.SEO介绍 1. 搜索引擎工作原理 搜索引擎现在主流有百度.谷歌.360,他们都有庞大的搜索引擎数据库,每个 ...
- web网页前端制作中的SEO方法
在SEO盛行的今天到处都在谈优化,对于网站前端制作人员来说,有几点是跟SEO相关 的,也就是SEO站内优化中的一部分,下面总结几点: 1.title,.页面的标题,不用多说,这个必须有! 2.keyw ...
- CSS网页布局中易犯的30个小错误
即使是CSS高手,也难免在书写CSS代码的时候出一些小错误,或者说,任何一种代码都是如此.小错误却往往造成大问题,浪费很多无辜的时间来调试和排错.查看下面这份CSS网页布局中易犯的10个小错误,努力的 ...
- 网页设计中11 款最好CSS框架
网页设计和发展领域已经成为竞争激烈的虚拟世界.想要在网络的虚拟世界中生存,仅有一堆静止的在线网络应用是远远不够的,网页必须要有很多功能,配以让人无法抗拒的设计.网页编码一定要合适.精确,才能保证不发生 ...
- 四、优化及调试--网站优化--SEO在网页制作中的应用
SEO分类:白帽SEO.黑帽SEO 白帽SEO: 内容上的SEO: 网站标题.关键字.描述 网站内容优化 Robot.txt文件 网站地图 增加外链引用 前端SEO: 网站结构布局优化 扁平化结构(一 ...
- 在网页布局中合理使用inline formating context(IFC)
引子:给大家出一个小小的考题,如何使用css来实现类似下面的在指定区域内,内容自适应的垂直居中.
- A4纸网页打印中对应像素的设定和换算
最近开发项目时遇到了网页打印的问题,这是问题之二,打印宽度设置 在公制长度单位与屏幕分辨率进行换算时,必须用到一个DPI(Dot PerInch)指标. 经过我仔细的测试,发现了网页打印中,默认采用 ...
随机推荐
- Git 修正错误
大部分的人都会犯错.所以每VCS提供了一个功能,修正错误,直到特定的点. Git提供功能使用,我们可以撤销已作出的修改到本地资源库. 假设用户不小心做了一些更改,以他的本地的仓库,现在他要扔掉这些变化 ...
- linux 防火墙 ufw使用
ufw是ubuntu是默认的防火墙配置工具,相对于iptables,ufw使用更加简单 ufw基本操作 1 []是代表可选内容,需要root权限 ufw [--dry-run] enable|di ...
- C语言中的字符串处理库函数介绍与实现
一.介绍 本文将主要介绍字符串处理库函数中的strlen.strcpy.strcat.strcmp.atoi等,主要由<string.h>头文件提供. 二.strlen函数:求字符串的长度 ...
- Mysql系列二:Mysql 开发标准规范
原文链接:http://www.cnblogs.com/liulei-LL/p/7729983.html 一.表设计 1. 库名.表名.字段名使用小写字母,“_”分割. 2. 库名.表名.字段名不超过 ...
- Hdg Remote Debug
https://www.assetstore.unity3d.com/en/#!/content/61863 https://forum.unity.com/threads/hdg-remote-de ...
- linux环境中,多个命令之间,通过&& ||执行,命令之间执行的逻辑是什么?
需求描述: 最近在写一个脚本的时候,要判断一个文件是否存在,有怎么样,没有就创建,这个时候 看到了一个test 结合 || 或者 &&的写法,就查看了下资料记录下是怎么个玩法. 操作过 ...
- [Object Tracking] Overview of Object Tracking
From: 目标跟踪方法的发展概述 From: 目标跟踪领域进展报告 通用目标的跟踪 经典目标跟踪方法 2010 年以前,目标跟踪领域大部分采用一些经典的跟踪方法,比如 Meanshift.Parti ...
- cmake构建时指定编译器架构(x86 or x64)
vs2015 x64编译器为例,cmake命令如下: cmake -G "Visual Studio 14 Win64" path\to\source\dir 去掉Win64,就是 ...
- linux Email 体系
大致了解了DNS与邮件服务器之间的关系后,接下来我们介绍邮件到底是如何传送到目的邮件主机的.下面我们分成“寄信”与“收信”两个主要的邮件服务器使用方式进行介绍.先说明关于“寄信”的部分.通常我们都是使 ...
- springMVC参数传递实例
最好所有的post请求用postman这个工具就好了. postman传对象