第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常用命名
随机推荐
- docker (2) 通用/镜像命令
原文:docker (2) 通用/镜像命令 Docker 的常用命令: (1)Docker help 命令: 可以查看有关docker的所有操作命令: (2)docker COMMAND -–hel ...
- day 3 创建窗口,移动-函数版
1.创建窗口 #-*- coding:utf-8 -*- import pygame import time def main(): #1.创建窗口 screen = pygame.display.s ...
- PostgreSQL 使用总结
1. USING的使用 USING是个缩写的概念:它接收一个用逗号分隔的字段名字列表, 这些字段必须是连接表共有的,最终形成一个连接条件,表示这些字段对必须相同. USING (a, b, c) 等效 ...
- generator-ivweb 基于react-redux的多页脚手架
背景 每个公司甚至每个项目组,在开发新项目的时候都会有一些自己特色的东西,比如公共组件,ajax请求拦截处理,内部积累的一些业务逻辑等等,如果没有自己的脚手架,那么拷贝代码成为常态,每个项目的结构,甚 ...
- 03-JVM内存模型:堆与方法区
一.堆(Heap) 1.1.什么是堆 堆是用于存放对象的内存区域.因此,它是垃圾收集器(GC)管理的主要目标.其具有以下特点: 堆在逻辑上划分为“新生代”和“老年代”.由于JAVA中的对象大部分是朝生 ...
- 「日常训练」Kefa and Company(Codeforces Round #321 Div. 2 B)
题意与分析(CodeForces 580B) \(n\)个人,告诉你\(n\)个人的工资,每个人还有一个权值.现在从这n个人中选出m个人,使得他们的权值之和最大,但是对于选中的人而言,其他被选中的人的 ...
- 微信小程序—day03
昨日问题 接着上一篇,昨天遇到的scroll-view组件不能滚动的问题. 今天经过调试,发现是由于:图片的实际宽高,大于给image设定的宽高导致的. 解决办法: 减小图片的实际宽高,使之小于ima ...
- web漏洞原理 (需要每周更新此篇文章)
SQL注入攻击简介 结构化查询语言SQL是用来和关系数据库进行交互的文本语言.它允许用户对数据进行有效的管理,包含了对数据的查询.操作.定义和控制等几个方面,例如向数据库写入.插入数据,从数据库读取数 ...
- web自动化原理揭秘
做过两年自动化测试的小伙伴说web自动化测试真的不难,无非就是一些浏览器操作,页面元素操作,常规的情况很容易处理,再学一学特殊元素的处理,基本就能应付项目的测试了. 这个话倒没错,但是真正要学好自动化 ...
- Linux命令应用大词典-第35章 终端
35.1 tty:显示当前连接到当前标准输入的终端设备文件名 35.2 consoletype:显示连接到标准输入的控制台类型 35.3 fgconsole:显示活动的虚拟终端数量 35.4 ming ...