zoukankan      html  css  js  c++  java
  • Css常用名字参考

    在XHTML中定义ID时都用得上,主要是方便CSS定义样式时能一眼看穿。所以,CSS命名仅作参考。

      (1)页面结构类

       容器: container

      页头:header

      内容:content/container

       页面主体:main

      页尾:footer

      导航:nav

      侧栏:sidebar

       栏目:column

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

      (2)导航类

      导航:nav

      主导航:mainnav

      子导航:subnav

      顶导航:topnav

      边导 航:sidebar

      左导航:leftsidebar

      右导航:rightsidebar

      位置 导航: crumb

      菜单:menu

      子菜单:submenu

      面包 屑:breadcrumb(即页面所处位置导航提示)

      (3)网页内容类

      标题: title

       摘要: summary

      箭头: arrow

      商标: label

      网站标志: logo

      转角/圆角: corner

      横幅广告: banner

      栏目: column

      子 菜单: subMenu

      搜索: search

      搜索框: searchBox

      登录: login

      工具条: toolbar

      下拉: drop

      标签页: tab

       当前的: current

      列表: list

      滚动: scroll

      服务: service

      提示信息: msg

      新闻: news

      小技巧: tips

      下载: download

      栏目标题: title

      热点: hot

      加入: joinus

       注册: regsiter

      指南: guide

      友情链接: friendlink

      状态: status

      版权: copyright

      按钮: btn

      合作伙伴: partner

      投票: vote

      头: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

      标签页:tab

      文章列表:list

      提示信息:msg

      小技巧:tips

      栏目标题:title

      加入:joinus

      指南:guild

      服务:service

      注册:regsiter

      状态:status

      投 票:vote

      合作伙伴:partner

      (二)注释的写法:

      /* Footer */

      内容区

      /* End Footer */

      (三)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

      (四)class的命名:

      (1)颜色:使用颜色的名称或者16进制代码,如

      .red { color: red; }

      .f60 { color: #f60; }

      .ff8600 { color: #ff8600; }

      (2)字体大小,直接使用"font+字体大小"作为名称,如

      .font12px { font-size: 12px; }

      .font9pt {font-size: 9pt; }

      (3)对齐样 式,使用对齐目标的英文名称,如

      .left { float:left; }

      .bottom { float:bottom; }

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

      .barnews { }

      .barproduct { }

      注意事项::

      1.一律小写;

      2.尽量用英文;

      3.不加中杠和下划线;

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

      主要的 master.css

      模块 module.css

      基本共用 base.css

      布局,版面 layout.css

      主题 themes.css

      专栏 columns.css

      文字 font.css

       表单 forms.css

      补丁 mend.css

      打印 print.css

       头:header

      内容:content/container

      尾:footer

      导航:nav

      侧栏:sidebar

      栏目:column

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

       左右中:leftrightcenter

      登录条:loginbar

      标志:logo

      广 告:banner

      页面主体:main

      热点:hot

      新闻:news

      下 载:download

      子导航:subnav

      菜单:menu

      子菜单:submenu

      搜索:search

      友情链接:friendlink

      页脚:footer

      版 权:copyright

      滚动:scroll

      内容:content

      标签页:tab

       文章列表:list

      提示信息:msg

      小技巧:tips

      栏目标题:title

       加入:joinus

      指南:guild

      服务:service

      注册:regsiter

      状态:status

      投票:vote

      合作伙伴:partner

      (二) 注释的写法:

      /*Footer*/

      内容区

      /*EndFooter*/

       (三) id的命名:

      (1)页面结构

      容器:container

      页头:header

      内容:content/container

      页面主体:main

      页尾:footer

       导航:nav

      侧栏:sidebar

      栏目:column

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

      左右中:leftrightcenter

      (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

      (四) class的命名:

      (1)颜色:使用颜色的名称或者16进制代 码,如:

      以下为引用的内容:

      .red{color:red;}

       .f60{color:#f60;}

      .ff8600{color:#ff8600;}

      (2)字体大小,直接使用 “font+字体大小”作为名称,如:

      以下为引用的内容:

       .font12px{font-size:12px;}

      .font9pt{font-size:9pt;}

       (3)对齐样式,使用对齐目标的英文名称,如:

      以下为引用的内容:

      .left{float:left;}

      .bottom{float:bottom;}

      (4)标题栏样式,使用”类别+功能”的方式命名,如:

       以下为引用的内容:

      .barnews{}

      .barproduct{}

      (五) 文件名命名:

      主要的:master.css

      模块:module.css

      基本共 用:base.css

      布局,版面:layout.css

      主题:themes.css

      专 栏:columns.css

      文字:font.css

      表单:forms.css

      补 丁:mend.css

      打印:print.css

      (六) 注意事项:

      (1)一律小写。

      (2)尽量用英文。

      (3)不加中杠和下划线。

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

  • 相关阅读:
    17. Java学习之枚举
    【myBatis】It's likely that neither a Result Type nor a Result Map was specified.
    【java】ORA-12505, TNS:listener does not currently know of SID given in connect descriptor
    【java】字符串截取
    【oracle】decode函数
    【myBatis】Mapped Statements collection already contains value for xxx
    【java异常】expected at least 1 bean which qualifies as autowire candidate for this depende
    【电脑】E470C如何关闭触摸板
    【java】spring中实例化bean的三种方法区别,使用场景
    【Excel】IF函数
  • 原文地址:https://www.cnblogs.com/linbaba/p/1737725.html
Copyright © 2011-2022 走看看