1.如div{...}会给所有的<div></div>增加样式。

2.名前井号“#”：对应html中的标签的id属性，写法为#name。如#p1{...}会给<p id="p1">ID is p1</p>增加样式。

3.名前小数点“.”：对应html中标签的class属性，写法为.name。如.p2{...}会给<p class="p2">CLASS is p2</p>增加样式。

4.中间空格“ ”：关系到html标签的层次，写法为css css[ css[... css]]，可以设多层。如DIV #p1 .span1{...}

则会给<div><p id="p1"><span class="span1"></span></p></div>中最内部的span1增加样式。

这样写的CSS必须严格遵守CSS与HTML标签层次，以下情况不会被这条CSS所应用：

<span class="span1"></span>

<p id="p1"><span class="span1"></span></p>

<div><span class="span1"></span></div>

5.中间逗号“,” ：表示并列关系，即该CSS有多个名称（可以精简重复的CSS样式）

如body,form,div{...}会为所有的<body></body>、<form></form>、<div></div>增加样式

6.名后冒号“:”：一般是指状态

如a:hover表示当鼠标悬停在a标签上时使用的样式

7.style中点代表类class,#代表id,也可以注释

h1代表html中的元素

tr.hr代表元素的子元素

css样式小框架的更多相关文章

  1. css样式小技巧

    1.css样式小技巧 HTML怎样设定使背景图片不随页面滚动而滚动 background-attachment:fixed; 2.实现li a 超过长度内容出现省略号… overflow:hidden ...

  2. css 样式小窍门

    css 样式小窍门 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  3. select自定义下拉三角符号,css样式小细节

    本来没有写文章的习惯,但是闲下来了,整理资料,发现还挺纠结,对前端来说.所以整理下,希望对看到的人有所帮助,毕竟我不是前端开发. 起因,是前端告诉我select 框的三角箭头不能自定义.但是第二次的时 ...

  4. 小谢第8问：ui框架的css样式如何更改

    目前有三种方法, 1.使用scss,增加样式覆盖,但是此种方法要求css的className需要与框架内的元素相一致,因此修改时候需要特别注意,一个父级的不同就可能修改失败 2.deep穿透,这种方法 ...

  5. Vue 框架-05-动态绑定 css 样式

    Vue 框架-05-动态绑定 css 样式 今天的小实例是关于 Vue 框架动态绑定 css 样式,这也是非常常用的一个部分 首先说一下 动态绑定,相对的大家都知道静态绑定,静态绑定的话,直接加 cl ...

  6. CSS调试小技巧 —— 调试DOM元素hover,focus,actived的样式

    最近学习html5和一些UI框架,接触css比较多,就来跟大家分享一下css中的一些调试技巧.之前做页面,css都是自己写的,所以要改哪里可以很快的找到,现在使用了UI框架,里面的样式是不可能读完的, ...

  7. CSS 样式显示为小手

    因为工作需要把鼠标放上去显示小手形状, css样式如下: style="cursor:hand"    部分浏览器支持 style="cursor:pointer&quo ...

  8. WebStorm 配置微信小程序开发 用html样式打开wxml 用css样式打开wxss 配置微信小程序提醒

    1.点开preferences 2.搜索找到“File Types” 3.找到"HTML",点击“+”按钮,添加“*.wxml”然后“apply” 4.和3一样,再找到 ‘casc ...

  9. 微信小程序的布局css样式

    微信小程序的布局css样式width: fit-content;font-size:20px;      /*设置文字字号*/color:red;           /*设置文字颜色*/font-w ...

随机推荐

  1. zookeeper集群（二）

    经过前一篇文章<zookeeper伪集群一>的阅读,相信大家对zookeeper集群已经有一定的了解了,接下来我们再谈谈zookeeper真集群.其实真集群和伪集群还是有很多相似的部分的, ...

  2. BZOJ 1441: Min（裴蜀定理）

    BZOJ 1441:Min Description 给出n个数(A1...An)现求一组整数序列(X1...Xn)使得S=A1*X1+...An*Xn>0,且S的值最小 Input 第一行给出数 ...

  3. dex2oat 加载多次

    我是一个做插件开发的人员,插件就是动态加载dex文件. 然后4.4以后,Android dalvik虚拟机,和ART. art运行的必须要把dex转换为oat elf文件. 然后,这个dex2oat需 ...

  4. HDFS写数据和读数据流程

    HDFS数据存储 HDFS client上传数据到HDFS时,首先,在本地缓存数据,当数据达到一个block大小时.请求NameNode分配一个block. NameNode会把block所在的Dat ...

  5. @property后面可以有哪些修饰符？

    原子性---nonatomic特质 如果不写默认情况为atomic(系统会自动加上同步锁,影响性能) 在iOS开发中尽量指定为nonatomic,这样有助于提高程序的性能 读/写权限---readwr ...

  6. 安装LoadRunner11报缺少vc2005_sp1_with_atl_fix_redist的错误

    找到安装程序自带的lrunner\Chs\prerequisites\vc2005_sp1_redist,双击运行vcredist_x86.exe,再重新安装LoadRunner即可成功. 参考资料: ...

  7. Jmeter beanshell preprocessor随机添加任意多个请求参数

    介绍下本次使用beanshell preprocessor的原因: 1.系统下可添加产品,一个产品可以有多个产品主题(比如:产品A(杭州三日游)拥有三个主题(研学.红学.夏令营)),我们在每次添加产品 ...

  8. python解析复杂json字符串

    因为项目需要,公司领导对提出了接口测试的要求,因此作为一个测试人员,我第一时间就想到了jmeter这个利器,前面文章也有说明过怎么用jmeter做http协议的接口测试,这里我不再做讲解,此篇主要讲解 ...

  9. 孤荷凌寒自学python第三十一天python的datetime.timedelta模块

     孤荷凌寒自学python第三十一天python的datetime.timedelta模块 (完整学习过程屏幕记录视频地址在文末,手写笔记在文末) datetime.timedelta模块是一个表示 ...

  10. 动态删边SPFA： [HNOI2014]道路堵塞

    [HNOI2014]道路堵塞 题目描述 $A$ 国有 $N$座城市,依次标为$1$到$N$.同时,在这$N$座城市间有$M$条单向道路,每条道路的长度是一个正整数.现在,$A$国交通部指定了一条从城市 ...