第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{}
第64天:CSS常用命名规范,有用!的更多相关文章
- CSS BEM 命名规范简介
[前言] BEM 是一个简单又非常有用的命名约定.让你的前端代码更容易阅读和理解,更容易协作,更容易控制,更加健壮和明确,而且更加严密.这篇文章主要介绍了CSS BEM 命名规范简介(推荐)的相关资料 ...
- web前端开发企业级CSS常用命名,书写规范总结
1.常用命名 标题: title 摘要: summary 箭头: arrow 商标: label 网站标志: logo 转角/圆角: corner 横幅广告: banner 子菜单: subMenu ...
- CSS 常用命名
在前端开发中,规范使用 DIV+CSS 命名,可以增强团队合作提高开发效率,有利于页面后期的维护和优化. 1.页面结构 wrap:外套.包裹,用于最外层. wrapper:外套,用于页面外围控制整体布 ...
- CSS — BEM 命名规范
推荐阅读: https://juejin.im/post/5b925e616fb9a05cdd2ce70d 1 什么是 BEM 命名规范 Bem 是块(block).元素(element).修饰符(m ...
- DIV+CSS布局命名规范
一.命名规则说明 1).所有的命名最好都小写2).属性的值一定要用双引号("")括起来,且一定要有值如class="divcss5",id="divc ...
- css常用命名规则
(一)常用的CSS命名规则 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrappe ...
- css常用命名
常用的CSS命名 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体佈局宽度:wrapper 左右中 ...
- 你如果知道这些css常用命名,绝对事半功倍!--摘抄
对于布局,即用.g-作为前缀,通常有以下推荐的写法 对于模块,即.m-作为前缀.元件,.u-作为前缀,通常有下面推荐的写法. 对于功能,即以.f-为前缀,通常推荐如下: 对于颜色,即以.s-为前缀,通 ...
- 搜狐前端css常用命名
随机推荐
- 推荐 的FPGA设计经验(3) 物理实现和时间闭环优化
Optimizing Physical Implementation and Timing Closure Planning Physical Implementation When planning ...
- Prism for WPF 搭建一个简单的模块化开发框架(二)
原文:Prism for WPF 搭建一个简单的模块化开发框架(二) 今天又有时间了,再改改,加了一些控件全局的样式 样式代码 <ResourceDictionary xmlns="h ...
- 广州Uber优步司机奖励政策(12月21日到12月27日)
滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...
- 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 ...
- 基于Docker的UI自动化初探
本文来自网易云社区 前言 一直以来,项目迭代的时间都是比较紧张的,开发加班加点coding,测试加班加点提bug.都说"时间像海绵里的水,挤挤总会有的"(当然这里的"挤挤 ...
- Selenium WebDriver(Python)API
1.通过示例介绍Selenium-WebDriver 一个简单的入门方法就是这个例子,它在Google上搜索术语“Cheese”,然后将结果页面的标题输出到控制台. java csharp pytho ...
- VMware SDK使用指南
刚开始用VMware官方推荐的SDK,真的是又臭又长,代码结构不清晰,易读性差.后来VMware的同学给推荐了一款开源的SDK,一上手感觉工作效率提高了100倍!推荐大家使用~. 该SDK对VMwar ...
- 参数为json格式的接口
1.参数为json格式,需要添加一个header信息web_add_header("Content-type", "application/json"); 2. ...
- 《Spark 官方文档》在Mesos上运行Spark
本文转自:http://ifeve.com/spark-mesos-spark/ 在Mesos上运行Spark Spark可以在由Apache Mesos 管理的硬件集群中运行. 在Mesos集群中使 ...
- MarkDown编辑器使用
有几款好用的MarkDown编辑器,参考: https://blog.csdn.net/bat67/article/details/72804251 我就下载的是 MarkDown 2来使用. 现用现 ...