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{}

第64天:CSS常用命名规范,有用!的更多相关文章

  1. CSS BEM 命名规范简介

    [前言] BEM 是一个简单又非常有用的命名约定.让你的前端代码更容易阅读和理解,更容易协作,更容易控制,更加健壮和明确,而且更加严密.这篇文章主要介绍了CSS BEM 命名规范简介(推荐)的相关资料 ...

  2. web前端开发企业级CSS常用命名,书写规范总结

    1.常用命名 标题: title 摘要: summary 箭头: arrow 商标: label 网站标志: logo 转角/圆角: corner 横幅广告: banner 子菜单: subMenu ...

  3. CSS 常用命名

    在前端开发中,规范使用 DIV+CSS 命名,可以增强团队合作提高开发效率,有利于页面后期的维护和优化. 1.页面结构 wrap:外套.包裹,用于最外层. wrapper:外套,用于页面外围控制整体布 ...

  4. CSS — BEM 命名规范

    推荐阅读: https://juejin.im/post/5b925e616fb9a05cdd2ce70d 1 什么是 BEM 命名规范 Bem 是块(block).元素(element).修饰符(m ...

  5. DIV+CSS布局命名规范

    一.命名规则说明 1).所有的命名最好都小写2).属性的值一定要用双引号("")括起来,且一定要有值如class="divcss5",id="divc ...

  6. css常用命名规则

    (一)常用的CSS命名规则 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrappe ...

  7. css常用命名

    常用的CSS命名 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体佈局宽度:wrapper 左右中 ...

  8. 你如果知道这些css常用命名,绝对事半功倍!--摘抄

    对于布局,即用.g-作为前缀,通常有以下推荐的写法 对于模块,即.m-作为前缀.元件,.u-作为前缀,通常有下面推荐的写法. 对于功能,即以.f-为前缀,通常推荐如下: 对于颜色,即以.s-为前缀,通 ...

  9. 搜狐前端css常用命名

随机推荐

  1. 推荐 的FPGA设计经验(3) 物理实现和时间闭环优化

    Optimizing Physical Implementation and Timing Closure Planning Physical Implementation When planning ...

  2. Prism for WPF 搭建一个简单的模块化开发框架(二)

    原文:Prism for WPF 搭建一个简单的模块化开发框架(二) 今天又有时间了,再改改,加了一些控件全局的样式 样式代码 <ResourceDictionary xmlns="h ...

  3. 广州Uber优步司机奖励政策(12月21日到12月27日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  4. 06003_redis在Linux上的安装

    1.redis-3.0.0.tar.gz下载链接:redis-3.0.0.tar.gz下载 密码:wpbu 2.安装redis编译的c环境,yum install gcc-c++ : 3.将redis ...

  5. 基于Docker的UI自动化初探

    本文来自网易云社区 前言 一直以来,项目迭代的时间都是比较紧张的,开发加班加点coding,测试加班加点提bug.都说"时间像海绵里的水,挤挤总会有的"(当然这里的"挤挤 ...

  6. Selenium WebDriver(Python)API

    1.通过示例介绍Selenium-WebDriver 一个简单的入门方法就是这个例子,它在Google上搜索术语“Cheese”,然后将结果页面的标题输出到控制台. java csharp pytho ...

  7. VMware SDK使用指南

    刚开始用VMware官方推荐的SDK,真的是又臭又长,代码结构不清晰,易读性差.后来VMware的同学给推荐了一款开源的SDK,一上手感觉工作效率提高了100倍!推荐大家使用~. 该SDK对VMwar ...

  8. 参数为json格式的接口

    1.参数为json格式,需要添加一个header信息web_add_header("Content-type", "application/json"); 2. ...

  9. 《Spark 官方文档》在Mesos上运行Spark

    本文转自:http://ifeve.com/spark-mesos-spark/ 在Mesos上运行Spark Spark可以在由Apache Mesos 管理的硬件集群中运行. 在Mesos集群中使 ...

  10. MarkDown编辑器使用

    有几款好用的MarkDown编辑器,参考: https://blog.csdn.net/bat67/article/details/72804251 我就下载的是 MarkDown 2来使用. 现用现 ...