Css+div 网站布局常用命名

css+div,div网站命名,div网站制作命名,css常用命名

整理了一些常用的网站div+css网站制作常用

(一)命名

(1)页面结构

容器: container
页头:header
内容:content/container

页面主体:main
页尾:footer
导航:nav

栏目:col
页面外围控制整体布局宽度:wrapper
侧栏:sidebar

左右中:left right center
主导航:mainNav
子导航:subNav

顶导航:topNav
边导航:sidebar
左导航:leftSidebar

右导航:rightSidebar
菜单:menu
子菜单:subMenu

标题: title
摘要: summary
子导航:subNav

(2)功能

标志:logo
广告:banner
登陆:login

登录条:loginBar
注册:regsiter
搜索:search

功能区:shop
标题:title
加入:joinus

状态:status
按钮:btn
滚动:scroll

提示信息:msg
文章列表:list
标签页:tab

当前的: current
小技巧:tips
图标: icon

注释:note
指南:guild
服务:service

热点:hot
新闻:news
下载:download

投票:vote
合作伙伴:partner
友情链接:link

版权:copyright

(二)class的命名

(1)标题栏样式,使用"类别+功能"的方式命名

.barNews { }
.barProduct { }

(2)模块结构css定义

模块标题 .module
模块标题 .moduleHead
模块包装 .moduleWrap

模块内容 .moduleContent

(三)css的命名

主要的 master.css
补丁 mend.css
打印 print.css

模块 module.css
基本共用 base.css
布局,版面 layout.css

主题themes.css
专栏 columns.css
文字 font.css

表单 forms.css

(四)注释的写法:

/* Footer */
内容区
/* End Footer */

(五)注意事项:

1.一律小写
2.尽量用英文
3.不加中杠和下划线

4.尽量不缩写,除非一看就明白的单词

原文地址:https://www.cnblogs.com/HughTan/p/1715986.html