第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常用命名
随机推荐
- vue组件化编程
vue文件包含3个部分 <template> <div></div> </template> <script> export default ...
- 5 Ways to Prevent the 300ms Click Delay on Mobile Devices
http://www.sitepoint.com/5-ways-prevent-300ms-click-delay-mobile-devices/
- 20145234黄斐《Java程序设计》第七周学习总结(课本部分)
教材知识概述 存储器系统是一个具有不同容量.成本和访问时间的存储设备的层次结构. 6.1 存储技术 1.随机访问存储器(RAM)分为两类:静态的(SRAM)比动态的(DRAM)快,但也贵得多 静态RA ...
- BZOJ1303_中位数图_KEY
题目传送门 较水,开两个桶即可. 题目可以理解为,将大于B的数看为1,小于B的数看为-1,将以B这个数为中位数的序列左右分为两半,加起来为0. code: #include <cstdio> ...
- 青岛Uber优步司机奖励政策(1月11日~1月17日)
滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...
- day 5 模块发布安装
1.模块的位置 现在当前路径查找,再到系统路径/usr/lib/python3.5/查找,再到其他系统路径查找 2.模块发布 1)模块目录结构 Msg ├── __init__.py ├── recv ...
- 3668: [Noi2014]起床困难综合症
3668: [Noi2014]起床困难综合症 https://www.lydsy.com/JudgeOnline/problem.php?id=3668 分析: 每一位分开考虑. 算出每一位为1,计算 ...
- iOS 中的正则表达式符号
最近重新看了一遍 iOS 的正则文档,简单翻译下文档中涉及到的符号 1.正则表达式元字符 符号 说明 \a 响铃, \u0007 \A 匹配输入的开始,只匹配第一行,也就是忽略多行选项 \b 不在[] ...
- 利尔达CC3200模块第一篇之-wlan_ap例程测试
1. 本次采用利尔达的CC3200模块,CC3200主时钟80M,内部没有flash,必须外接SPI Flash.本次测试采用利尔达科技的CC3200的底板和模块(左边).烧写连接VCC, GND, ...
- 一步一步学习JNI
本文来自网易云社区 作者:孙有军 前言 本篇的主要目的就是JNI开发入门,使大家对JNI开发流程有一个大致的了解,后续再进行深入学习. JNI不是Android特有的,JNI是Java Native ...