@@ -450,8 +450,6 @@ CSS的选择器分为两大类:基本选择题和扩展选择器。
450
450
451
451
标签选择器,选择的是页面上所有这种类型的标签,所以经常描述“** 共性** ”,无法描述某一个元素的“个性”。
452
452
453
-
454
-
455
453
举例:
456
454
457
455
``` html
497
495
498
496
(3)选择的所有,而不是一个。
499
497
500
-
501
-
502
498
### 2、ID选择器:规定用` # ` 来定义
503
499
504
500
针对某一个特定的标签来使用,只能使用一次。css中的ID选择器以”#”来定义。
@@ -527,7 +523,6 @@ id选择器的选择符是“#”。
527
523
528
524
** 一个标签可以被多个css选择器选择:**
529
525
530
-
531
526
比如,我们可以同时让标签选择器和id选择器作用于同一个标签。如下:
532
527
533
528
![ ] ( http://img.smyhvae.com/20170710_1737.png )
@@ -541,7 +536,6 @@ id选择器的选择符是“#”。
541
536
542
537
一个标签可以被多个css选择器选择,共同作用,这就是“** 层叠式** ”的第一层含义(第一层含义和第二层含义,放到css基础的第三篇文章里讲)。
543
538
544
-
545
539
### 3、类选择器:规定用圆点` . ` 来定义
546
540
547
541
、针对** 你想要的所有** 标签使用。优点:灵活。
@@ -577,8 +571,6 @@ css中用`.`来表示类。举例如下:
577
571
<h3 class =" teshu" class =" zhongyao" >我是一个h3啊</h3 >
578
572
```
579
573
580
-
581
-
582
574
** 类选择器使用的举例:**
583
575
584
576
类选择器的使用,能够决定一个人的css水平。
@@ -661,13 +653,12 @@ css中用`.`来表示类。举例如下:
661
653
![ ] ( http://img.smyhvae.com/2015-10-03-css-09.png )
662
654
663
655
664
-
665
656
## CSS的几种高级选择器
666
657
667
658
** 高级选择器:**
668
659
669
660
- 后代选择器:用空格隔开
670
- - 交集选择器:用 ` . ` 隔开
661
+ - 交集选择器:选择器之间紧密相连
671
662
- 并集选择器(分组选择器):用逗号隔开
672
663
- 伪类选择器
673
664
@@ -771,7 +762,11 @@ css中用`.`来表示类。举例如下:
771
762
在sublime中输入` p.haha ` ,按tab键后,会生成` <p class="haha"></p> ` 。
772
763
773
764
774
- ### 2、交集选择器
765
+ ### 2、交集选择器:定义的时候紧密相连
766
+
767
+ 定义交集选择器的时候,两个选择器之间紧密相连。一般是以标签名开头,比如` div.haha ` 比如` p.special ` 。
768
+
769
+ 如果后一个选择器是类选择器,则写为` div.special ` ;如果后一个选择器id选择器,则写为` div#special ` 。
775
770
776
771
来看下面这张图就明白了:
777
772
@@ -827,7 +822,6 @@ h3.special.zhongyao{
827
822
828
823
上面这种写法,是 IE7 开始兼容的,IE6 不兼容。
829
824
830
- 交集选择器,我们一般都是以标签名开头,比如` div.haha ` 比如` p.special ` 。
831
825
832
826
833
827
@@ -848,8 +842,6 @@ p,h1,#mytitle,.one{
848
842
![ ] ( http://img.smyhvae.com/2015-10-03-css-10.png )
849
843
850
844
851
-
852
-
853
845
## 一些 CSS3 选择器
854
846
855
847
> 所有的css3选择器,我们放在HTML5和CSS3课上介绍。暂时先接触一部分。
0 commit comments