• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >CSS > DIV+CSS命名规范全记录

DIV+CSS命名规范全记录

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-08-06

本文主要包含DIV,CSS,命名规范等相关知识,佚名 希望在学习及工作中可以帮助到您

我们开发CSS+DIV网页(Xhtml)时候,比较困惑和纠结的事就是CSS命名,特别是新手不知道什么地方该如何命名,怎样命名才是好的方法。

  命名规则说明:

  1)、所有的命名最好都小写

  2)、属性的值一定要用双引号("")括起来,且一定要有值如class="divcss5",id="divcss5"

  3)、每个标签都要有开始和结束,且要有正确的层次,排版有规律工整

  4)、空元素要有结束的tag或于开始的tag后加上"/"

  5)、表现与结构完全分离,代码中不涉及任何的表现元素,如style、font、bgColor、border等

  6)、定义,应遵循从大到小的原则,体现文档的结构,并有利于搜索引擎的查询。

  7)、给每一个表格和表单加上一个唯一的、结构标记id

  8)、给图片加上alt标签

  9)、尽量使用英文命名原则

  10)、尽量不缩写,除非一看就明白的单词

  相对网页外层重要部分CSS样式命名:

  外套wrap------------------用于最外层头部header----------------用于头部主要内容main------------用于主体内容(中部)左侧main-left-------------左侧布局右侧main-right-----------右侧布局导航条nav-----------------网页菜单导航条内容content---------------用于网页中部主体底部footer-----------------用于底部

  DIV+CSS命名参考表:

  以下为CSS样式命名与CSS文件命名参考表,DIV CSS命名集合:

CSS样式命名

说明

网页公共命名

#wrapper

页面外围控制整体布局宽度

#container或#content

容器,用于最外层

#layout

布局

#head,#header

页头部分

#foot,#footer

页脚部分

#nav

主导航

#subnav

您可能想查找下面的文章:

  • css小技巧
  • DIV 自动滚动功能及滚动条颜色修改的代码
  • CSS控制div宽度最大宽度/高度和最小宽度/高度的方法
  • 解决img在div中居中的问题
  • 设置一个DIV块固定在屏幕中央的两种方法(推荐)
  • 使用CSS的overflow属性防止float撑开div的方法
  • CSS文本和div垂直居中方法总结
  • 使用CSS3的box-sizing属性解决div宽高被内边距撑开的问题
  • html+css+div实现电影结束效果
  • 不固定宽度和高度的情况下CSS调整div居中的方法总结

相关文章

  • 2017-08-06相对、绝对和固定定位的比较
  • 2017-08-06IE下target获得焦点时产生虚线问题的解决方法
  • 2017-08-06CSS3 :nth-child()伪类选择器实现奇偶行显示不同样式
  • 2017-08-06CSS的一些小问题如网页中版权符号显示问题等等
  • 2017-08-06css ID类和class类的长命名与短命名
  • 2017-08-06css中font的简写方法(包括粗细、大小、行高、字体)
  • 2017-08-06你不知道的outerText,innerText 区别说明
  • 2017-08-06CSS书写规范、顺序和命名规则
  • 2017-08-06纯CSS实现鼠标悬停显示图片效果的实例分享
  • 2017-08-06纯css3实现照片墙效果

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • text-indent的用法包括块级元素等详细总结
    • css float浮动属性的深入研究及详解拓展(二)
    • 父级元素未设置高度和宽度时高度塌陷问题的解决方法
    • DIV无法自动高度 IE8无法自动高度
    • JavaScript CSS Style属性对照表
    • 浅谈合理架构CSS
    • 浏览器如何判断css优先级
    • 老调重弹的CSS优先级
    • 分享几个CSS小众但炫酷的技巧
    • 一款利用纯css3实现的360度翻转按钮的实例教程

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有