css 命名 有的加# ,有的加点 ,有的没加。请问下都在什么情况下用的?
【nav{}】
这样的样式是给特定的标签直接定义样式时使用的,这个样式名称是跟标签是相对应的,比如我要给<p></p>这个标签设置样式,那我就可以直接写:p{样式}就可以,但是这样写并没有特指某个标签,而是指的页面内所有<p>标签的样式,所以,使用了这种方法,那么只要你的页面里有<p>这个标签的,那他们的样式就是统一的样式;
【.nav{}】这种前面加 “.” 的样式,是说明该样式是由类调用的,也就是容器是使用class调用这个样式的,这种样式是可以被多个不同的容器多次重复调用而没有限制的,属于共有样式;
【#nav{}】这种前面加 “#” 的样式是ID调用的,就是容器使用id=“#nav”这样来调用的,这样的样式是一次性的,专有的样式,即该样式只能是一个指定的容器只能调用一次这个样式,其他容器不能再次调用这个样式,也不可以多次调用,属于私有样式;
【关于调用样式的技巧】
举个例子:
<div class="demo1" id="demo2">示例一</div>
<div class="demo1" id="demo3">示例二</div>
<div class="demo4" id="demo5">示例三</div>
这是两个div,容器是可以同时使用class和id调用样式的,这样的好处在于可以将两个div的共同样式放在类样式里面,而各自不同的样式可以放在id样式里面,这样就避免重复写大量相同代码造成冗余的情况发生!
示例一的需要的样式是红色、宋体字,示例二是黑色、宋体字,而这三个示例都需要水平居中显示,那么他们的共同点就是示例一和示例二都需要宋体字,三个示例都要居中显示,那么就可以这样写样式:
<style>
<!--
.demo1{font-family:"宋体";} /*宋体字*/
#demo2{color:red;} /*红色色*/
#demo3{color:black;} /*黑色*/
div{margin:0 auto;} /*将页面内所有div居中显示*/
-->
</style>
这样就可以避免重复写很多不需要多次写的重复代码
css 命名 有的加# ,有的加点 ,有的没加。请问下都在什么情况下用的?的更多相关文章
- 使用Django的时候,页面请求正常,也没有报任何错误,甚至连警告都没有的情况下,页面却还是原地不动或者闪一下或者无限显示加载动画的情况下的解决办法
这个问题描述比较笼统,但根据我目前遇到过两种情况来看,似乎都比较重要而且实用,所以打算分别讲述一下. 说明:Django的版本是Django2.0 第一种:URL配置错误 页面闪一下,却原地不动,可能 ...
- 判断jquery类库是否加载,如未加载则加载。
本人所有文章使用到的东西均在"渭南电脑维修网"网站中得以实现和应用,还请大家参考. 抄写别人网站的同时,N多不同的网站,势必有N多的css.javascript引用文件都会重复引用 ...
- (转)面向属性的CSS命名
原文链接:戳这里 自从开始做前端开发以来,我发现在开发页面的时候,总是有一个问题十分影响自己的开发效率,这个问题就是css的命名,主要是指css类选择器的命名.这个问题主要体现在:第一,有的内容你压根 ...
- 面向属性的CSS命名
自从开始做前端开发以来,我发现在开发页面的时候,总是有一个问题十分影响自己的开发效率,这个问题就是css的命名,主要是指css类选择器的命名.这个问题主要体现在:第一,有的内容你压根想不出用什么名字来 ...
- 前端开发人员要注意的css规范,css命名。
刚工作的时候也没注意关于css的规则,根据自己的心情想怎么用就怎么用,完成工作就好不会考虑代码的可读性,加载的性能,现在身为前端的一员就要有程序员的自我修养(嘿嘿,是不是很有责任感啊). 废话不多说, ...
- CSS 命名规范将省下调试时间
我听说很多开发者厌恶 CSS.而在我的经验中,这往往是由于他们并没有花时间来学习 CSS. CSS 算不上是最优美的『语言』,但迄今二十多年来,它都是美化 web 举足轻重的工具.从这点来说,也还算不 ...
- CSS命名规范
DIV+CSS规范命名大全集合 前端人员必看CSS命名规范 整理: 文件名必须由小写字母.数字.中划线组成 ).所有的命名最好都小写,一律采用小写加中划线的方式,不允许使用大写字母或 _2).属性的值 ...
- html,css命名规范 (转)
HTML+CSS命名规范总结 1.HTML部分 1.1添加必须的utf-8的字符集,并且使用HTML5的简洁 方式: <meta charset="utf-8"> 1. ...
- css命名书写规范小结。
单行形式书写风格的排版约束 1. 每一条规则的大括号 { 前后加空格 2. 多个selector共用一个样式集,则多个selector必须写成多行形式 3. 每一条规则结束的大括号 } 前 ...
随机推荐
- hibernate中Session的load和get方法的区别是什么?
主要有以下三项区别: ① 如果没有找到符合条件的记录,get方法返回null,load方法抛出异常. ② get方法直接返回实体类对象,load方法返回实体类对象的代理. ③ 在Hibernat ...
- python--moviepy--视频编辑
MoviePy是一个用于视频编辑的python模块,你可以用它实现一些基本的操作(比如视频剪辑,视频拼接,插入标题),还可以实现视频合成,还有视频处理,抑或用它加入一些自定义的高级的特效.总之,它的功 ...
- FFT用于高效大数乘法(当模板用)
转载来源:https://blog.csdn.net/zj_whu/article/details/72954766 #include <cstdio> #include <cmat ...
- TTTTTTTTTTT POJ 2749 修牛棚 2-Sat + 路径限制 变形
Building roads Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 7019 Accepted: 2387 De ...
- Android 造炫目的圆形菜单 秒秒钟高仿建行圆形菜单
1.概述 今天打开建行看存款,一看伤心欲绝,再看:我擦,这个圆形菜单挺炫.于是,为了掩盖我悲痛的心情,我决定是实现这个效果.好了,其实还有个原因,记得我初学android那会我做的应用被鄙视了,说我的 ...
- JS框架_(coolShow.js)图片旋转动画特效
百度云盘 传送门 密码:ble6 coolShow.js插件图片旋转动画效果 <!DOCTYPE HTML> <head> <meta http-equiv=" ...
- ping不通服务器就邮件警告
ping不通服务器就发一封邮件 (单台) vim /root/scipt/1.sh #!/bin/bash ping -c 4 192.168.0.116 &> /dev/null #p ...
- MYSQL中NULL陷阱
1.NULL值不能做比较,跟任何值比较,NULL值都不会被筛选出来 2.NULL值做数学运算后依旧为NULL,比如 SELECT 5 + NULL 结果为NULL,但是SELECT 5+ '' 结果为 ...
- 微信小程序需求IIS服务器配置https关于SSL,TLS的综合解决方案
SpringBoot配置SSL同时支持http和https访问 传输层安全性协议(英语:Transport Layer Security,缩写作 TLS),及其前身安全套接层(Secure Socke ...
- ad2014注册出现:注册 - 激活错误 (0015.111)
将安装包内的(adlmact.dll & adlmact_libFNP.dll)这两个文件取出并覆盖即可.安装包内文件具体位置:在安装包内搜索“adlmact”出现的两个文件“adlmact_ ...