css 命名规则

一个有规则的命名 会提高代码的可读性

一、命名规则说明:

1)、所有的命名最好都小写
2)、属性的值一定要用双引号(“”)括起来
3)、给图片加上alt标签
4)、尽量使用英文命名原则
5)、尽量不缩写,除非一看就明白的单词

二、相对网页外层重要部分CSS样式命名:

外套 wrap ------------------用于最外层
头部 header ----------------用于头部
主要内容 main ------------用于主体内容(中部)
左侧 main-left -------------左侧布局
右侧 main-right -----------右侧布局
导航条 nav -----------------网页菜单导航条
内容 content ---------------用于网页中部主体
底部 footer -----------------用于底部

三、 常用的样式命名

#wrapper 页面外围控制整体布局宽度
#container 或 #content 容器,用于最外层
#layout 布局
#head 或 #header 页头部分
#foot 或 #footer 页脚部分
#nav 主导航
#subnav 二级导航
#menu 菜单
#submenu 子菜单
#sideBar 侧栏
#sidebar_a 或 #sidebar_b 左边栏或右边栏
#main 页面主体
#tag 标签
#msg 或 #message 提示信息
#tips 小技巧
#vote 投票
#friendlink 友情连接
#title 标题
#summary 摘要
#loginbar 登录条
#searchInput 搜索输入框
#hot 热门热点
#search 搜索
#search_output 搜索输出和搜索结果相似
#searchBar 搜索条
#search_results 搜索结果
#copyright 版权信息
#branding 商标
#logo 网站LOGO标志
#siteinfo 网站信息
#siteinfoLegal 法律声明
#siteinfoCredits 信誉
#joinus 加入我们
#partner 合作伙伴
#service 服务
#regsiter 注册
#arr 或 #arrowr 箭头
#guild 指南
#sitemap 网站地图
#list 列表
#homepage 首页
#subpage 二级页面子页面
#tool 或 #toolbar 工具条
#drop 下拉
#dorpmenu 下拉菜单
#status 状态
#scroll 滚动
.tab 标签页
.left 居左
.right 居右
.center 居中
.news 新闻
.download 下载
.banner 广告条(顶部广告条)
.products 产品
.products-prices 产品价格
.products-description 产品描述
.products-review 产品评论
.editor_review 编辑评论
.news_release 最新产品
.publisher 生产商
.screenshot 缩略图
.faqs 常见问题
.keyword 关键词
.blog 博客
.forum 论坛

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/70707.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python容器模块Collections

Python附带一个模块,它包含许多容器数据类型,名字叫作collections defaultdict defaultdict与dict类型不同,你不需要检查key是否存在,所以我们能这样做: from collections import defaultdict colours ((Yasoob, Y…

angular 测试 api 说明

detectChanges(checkNoChanges?: boolean): void; 触发组件的变更检测周期。它重新评估组件的模板并相应地更新视图。checkNoChanges参数是可选的,可用于检查是否存在不应发生的任何更改。 checkNoChanges(): void; 执行变更检测运行,以确保组件没有意外…

Kali Linux渗透测试技术介绍【文末送书】

文章目录 写在前面一、什么是Kali Linux二、渗透测试基础概述和方法论三、好书推荐1. 书籍简介2. 读者对象3. 随书资源 写作末尾 写在前面 对于企业网络安全建设工作的质量保障,业界普遍遵循PDCA(计划(Plan)、实施(Do…

【网络爬虫笔记】爬虫Robots协议语法详解

Robots协议是指一个被称为Robots Exclusion Protocol的协议。该协议的主要功能是向网络蜘蛛、机器人等搜索引擎爬虫提供一个标准的访问控制机制,告诉它们哪些页面可以被抓取,哪些页面不可以被抓取。本文将进行爬虫Robots协议语法详解,同时提供…

管理学国际化与领导力视角

随着全球化的进程不断加速,管理学的国际化已经成为一个不可忽视的趋势。在这个多元化和全球化的时代,管理者需要具备跨文化的领导力,以适应不同国家和地区的商业环境,并有效地管理全球团队。本文将从管理学国际化和领导力的角度探…

Java # Java容器

Java容器的分类 List ArrayList 源码 public static vooid main(String[] args){ArrayList<String> list new ArrayList<>();list.add("hello");list.add(1, "hello");list.remove("hello"); } list.add("hello"); …

ts学习笔记

1.安装 npm install typescriptnext 2.vscode通过创建.vscode/settings.json来使用这个版本&#xff1b; { "typescript.tsdk":"./node_modules/typescript/lib" } 1. TypeScript 有两个“顶层类型”&#xff08;any和unknown&#xff09;&#xff0c;但…

Python代码雨

系列文章 序号文章目录直达链接1浪漫520表白代码https://want595.blog.csdn.net/article/details/1306668812满屏表白代码https://want595.blog.csdn.net/article/details/1297945183跳动的爱心https://want595.blog.csdn.net/article/details/1295031234漂浮爱心https://want…

InnoDB全文索引是如何实现的?

分析&回答 全文索引的底层实现为倒排索引。 为什么叫倒排索引&#xff08;反向索引&#xff09; 当表上存在全文索引时&#xff0c;就会隐式的建立一个名为FTS_DOC_ID的列&#xff0c;并在其上创建一个唯一索引&#xff0c;用于标识分词出现的记录行。你也可以显式的创建…

golang字符串转64位整数

在Go语言中&#xff0c;可以使用strconv包中的ParseInt函数将字符串转换为64位整数。以下是一个示例代码&#xff1a; package main import ( "fmt" "strconv" ) func main() { str : "12345" num, err : strconv.ParseInt(str, 10, 64…

LeetCode刷题笔记【26】:贪心算法专题-4(柠檬水找零、根据身高重建队列、用最少数量的箭引爆气球)

文章目录 前置知识860.柠檬水找零题目描述解题思路代码 406.根据身高重建队列题目描述解题思路代码 452. 用最少数量的箭引爆气球题目描述踩坑-进行模拟正确思路的贪心 总结 前置知识 参考前文 参考文章&#xff1a; LeetCode刷题笔记【23】&#xff1a;贪心算法专题-1&#x…

举例说明自然语言处理(NLP)技术

自然语言处理&#xff08;NLP&#xff09;技术是一种人工智能领域的技术&#xff0c;用于处理自然语言文本或语音信号。下面是一些自然语言处理技术的例子&#xff1a; 机器翻译&#xff1a;机器翻译是一种自然语言处理的技术&#xff0c;它可以将一种语言的文本翻译成另一种语…

docker指令

目录 1、docker命令 2、镜像和容器的关系 3、Dockfile中特殊语法 &#xff08;1&#xff09;CMD 和 ENTRYPOINT ① 普通案例 ② 特殊案例 a、dockfile中的命令 和 命令行中的命令有冲突 b、使用exec执行PID1的命令 ③【cmd、entrypoint】和 exec 的关系 &#xff08…

2023年05月 C/C++(八级)真题解析#中国电子学会#全国青少年软件编程等级考试

C/C编程&#xff08;1~8级&#xff09;全部真题・点这里 第1题&#xff1a;道路 N个以 1 … N 标号的城市通过单向的道路相连:。每条道路包含两个参数&#xff1a;道路的长度和需要为该路付的通行费&#xff08;以金币的数目来表示&#xff09; Bob and Alice 过去住在城市 1.在…

百度云智大会:科技与创新的交汇点

​ 这次的百度云智大会&#xff0c;可谓是亮点云集—— 发布了包含42个大模型、41个数据集、10个精选应用范式的全新升级千帆大模型平台2.0&#xff0c;发布首个大模型生态伙伴计划&#xff0c;而且也预告了文心大模型4.0的发布&#xff0c;大模型服务的成绩单也非常秀&#x…

ABAP BP维护客户cl_md_bp_maintain=>maintain

ps_head结构如下 下面是封装好的form示例 *&---------------------------------------------------------------------* *& Form frm_modify_customer *&---------------------------------------------------------------------* *& text *&--------…

TypeScript类型守卫

概念 在语句的块级作用域【if语句内或条目运算符表达式内】缩小变量类型的一种类型推断的行为。 类型守卫可以帮助我们在块级作用域中获得更为需要的精确变量类型&#xff0c;从而减少不必要的类型断言。 类型判断&#xff1a;typeof实例判断&#xff1a;instanceof字面量相等…

2023-08-31 LeetCode每日一题(一个图中连通三元组的最小度数)

2023-08-31每日一题 一、题目编号 1761. 一个图中连通三元组的最小度数二、题目链接 点击跳转到题目位置 三、题目描述 给你一个无向图&#xff0c;整数 n 表示图中节点的数目&#xff0c;edges 数组表示图中的边&#xff0c;其中 edges[i] [ui, vi] &#xff0c;表示 ui…

一个简单的DNS服务器

DNS数据包的格式如下&#xff1a; 头部&#xff1a;会话标识ID&#xff0c;用于标识报文的ID标识&#xff0c;对于请求报文和其对应的应答报文&#xff0c;这个字段是相同的&#xff0c;通过它可以区分DNS应答报文是哪个请求的响应。正文&#xff1a; Queries区域 查询名QNAME…

Python入门学习14(面向对象)

一、内置方法 二、封装 1. 封装的概念是指&#xff1f; 将现实世界事物在类中描述为属性和方法&#xff0c;即为封装。 2. 什么是私有成员&#xff1f;为什么需要私有成员&#xff1f; 现实事物有部分属性和行为是不公开对使用者开放的。同样在类中描述属性和方法的时…