zoukankan      html  css  js  c++  java
  • 第64天:CSS常用命名规范,有用!

    CSS常用命名,必须记住

    一、常用命名

    标题:title

    摘要:summary

    箭头:arrow

    商标:label

    网站标志:logo

    转角/圆角:corner

    横幅广告:banner

    子菜单:subMenu

    搜索框:searchBox

    登录:login

    登录条:loginbar

    工具条:toolbar

    下拉:drop

    标签页:tab

    当前的:current

    列表:list

    滚动:scroll

    服务:service

    提示信息:msg

    热点:hot

    新闻:news

    小技巧:tips

    下载:download

    栏目标题:title

    热点:hot

    加入:joinus

    注册:regsiter

    指南:guide

    友情链接:friendlink

    状态:status

    版权:copyright

    按钮:btn

    合作伙伴:partner

    投票:vote

    左/右/中:left/right/center

    简介:profiles

    评论:comment

    二、页面结构

    容器:container

    页头:header

    内容:content/container

    页面主体:main

    页尾:footer

    导航:nav

    侧栏:sidebar

    栏目:column

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

    三、导航

    导航:nav

    主导航:mainnav

    子导航:subnav

    顶导航:topnav

    边导航:sidebar

    左导航:leftsidebar

    右导航:rightsidebar

    菜单:menu

    子菜单:submenu

    标题:title

    摘要:summary

    四、功能

    标志:logo

    广告:banner

    登陆:login

    登录条:loginbar

    注册:register

    搜索: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{}

  • 相关阅读:
    安装xshell6
    eclipse的安装和汉化
    collectd+infludb+grafana实现tomcat JVM监控
    百度网站统计和CNZZ网站统计对比
    shell,计算指定行的和,计算指定列的和
    我为什么要写博客
    kafka监控之topic的lag情况监控
    用rundeck启动tomcat报错
    xwiki升级8.8.4
    矩阵掩膜操作
  • 原文地址:https://www.cnblogs.com/le220/p/7714374.html
Copyright © 2011-2022 走看看