• DIV+CSS命名规则


    网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容如下:

    页头header  如:#header{属性:属性值;}.header{属性:属性值;},也许你需要了解classid区别及用法
    登录条: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
    常用配合标签divh1h2h3h4spanembstrongfontu

    1.CSSID 的命名 也许你需要了解classId区别

    外 套:wrap              主导航:mainNav        子导航:subnav
    页 脚:footer             整个页面:content      页 眉:header
       权:copyRight      商 标:label              标 题:title
    主导航:mainNav(globalNav)                  顶导航:topnav
    边导航:sidebar           左导航:leftsideBar   右导航:rightsideBar
    旗 志:logo                标 语:banner         菜单内容1menu1Content
    菜单容量: 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

  • 相关阅读:
    Java实现 LeetCode 92 反转链表 II
    Java实现 LeetCode 92 反转链表 II
    Java实现 LeetCode 91 解码方法
    Java实现 LeetCode 91 解码方法
    Java实现 LeetCode 91 解码方法
    CDialogBar(对话条)和CReBar(伸缩条)的编程
    WinSock
    WinSock
    静态文本显示图标图片
    拆分窗口
  • 原文地址:https://www.cnblogs.com/shuhegusheng/p/5630505.html
Copyright © 2020-2023  润新知