CSS 类和ID的常用命名

 

CSS 类和ID的常用命名：

网站头部:    head/header(头部) top（顶部）导航：   nanv 导航具体区分：topnav(顶部导航)、mainnav(主导航)、mininav(迷你导航)、textnav(导航文本)、subnav(子导航/二级导航)
旗帜、广告和商标：logo（旗帜）、brand(商标)、banner(标语)
搜索：sreach(搜索)、sreachbox(搜索框)、sreachbtn(搜索按钮)、sreachinput（搜索输入框）
注册和登录：login(登录)、regsiter(注册)、userbox(用户名/通行证的文本框)、password(密码)
布局、分栏和框：   layout(布局)、bigdiv(大div)、leftdiv(左分栏)、rightdiv(右分栏)、leftfloat(左浮动)、rightfloat(右浮动)、mainbox()、subpage(子页面/二级页面)
页脚/底部：foot/footer(页脚/底部)、copyright(版权信息)、sitemap(网站地图)
其他：content(内容)、skin(皮肤)、title(标题)、from(表单)、pic(图片)、news(新闻)、shop(购物区)、list(列表/清单)、newslist(新闻列表)、downloadlist(下载列表)、piclist(图片列表)、dropmenv(下拉菜单)、cor/corner(圆角)、homepage(首页)、crumb(当前位置导航)
实际上上面的id命名我会经常用大小写和_来区分，比如主导航就是MainNav,如果还有必要在区分就是MainNav_1,MainNav_2等等。也可以使用"类型+变量名称"的规则来命名，比如写一个红色字体的class,可以
.f_red {}(f是font 字体的缩写)。总之原则是：大小写、_、缩写，大大增强代码的可读性。

另外我还经常使用"in"的写法做子divd的命名，写法in+父div,这样可以避免前面命名过了后面div不知道怎么去命名。比如intop、inbox、infrom、inlogin等等。