第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常用命名
随机推荐
- Python概述
1.什么是Python? Python是一种解释型,面向对象,动态数据类型的高级程序设计语言. Python由Guido van Rossum于1989年底发明,第一个公开发行版发行于1991年. 像 ...
- netty之管道处理流程
1.我们在使用netty的是有都会存在将channelBuffer的数据处理成相应的String或者自定义数据.而这里主要是介绍管道里面存在的上行和下行的数据处理方式 2.通过一张图片来看一下具体管道 ...
- eclipse插件SCON的SConscript文件和头文件以及C文件包含路径
1. 本次的头文件路径\Hi2110-B657SP3-SDK\src_release_657SP3\src\lib\onenet\public,以此例子作为研究,本次开发使用eclipse,用到SCO ...
- 数据库路由中间件MyCat - 背景篇(2)
此文已由作者张镐薪授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. MyCat的前世今生 如前文所说,Amoeba.Cobar.MyCat等属于同宗一脉.若Amoeba能继续下 ...
- Android 9 适配怎么做? “QQ音乐”优化实录
WeTest 导读 2018年8月7日,Google对外发布最新 Android 9.0 正式版系统,并宣布系统版本Android P 被正式命名为代号“Pie”,最新系统已经正式推送包括谷歌Pixe ...
- appium -- 页面出现弹窗,关闭后,无法识别页面元素
1. 问题:如图所示:在修改手势密码的过程中,点击了返回按钮后,弹出该弹窗:点击继续设置后,就发现 driver.getPageSource()获取不到页面元素.在找了一圈无用的资料后,没有什么好的处 ...
- 各种对list,string操作函数的总结
#encoding=utf-8#reverse,用来反转lista=['aa','bb','cc']a.reverse()print a#['cc', 'bb', 'aa']#不能直接print a. ...
- HDU - 6409:没有兄弟的舞会(数学+思维)
链接:HDU - 6409:没有兄弟的舞会 题意: 题解: 求出最大的 l[i] 的最大值 L 和 r[i] 的最大值 R,那么 h 一定在 [L, R] 中.枚举每一个最大值,那么每一个区间的对于答 ...
- 孤荷凌寒自学python第八十天开始写Python的第一个爬虫10
孤荷凌寒自学python第八十天开始写Python的第一个爬虫10 (完整学习过程屏幕记录视频地址在文末) 原计划今天应当可以解决读取所有页的目录并转而取出所有新闻的功能,不过由于学习时间不够,只是进 ...
- spark写入ES(动态模板)
使用es-hadoop插件,主要使用elasticsearch-spark-20_2.11-6.2.x.jar 官网:https://www.elastic.co/guide/en/elasticse ...