css基础知识之标签分类

html-css019

css基础知识之标签分类,第1张

按照显示方式分为块元素 、行内元素和行内块元素(内联元素)

典型代表,Div,h1-h6,p,ul,li

特点:

典型代表 span ,a, ,strong , em, del, ins

特点:

典型代表 input img

特点:

1.块元素转行内元素

display:inline

2.行内元素转块元素

display:block

3.块和行内元素转行内块元素

display:inline-block

别混淆概念,CSS没有标签的,只有选择器

选择器有十多种,不过常用的就4种:标签选择器、类选择器、ID选择器和下级选择器

其他的选择器因为古老的IE不支持,所以我们不用

标签选择器很简单,就是直接用HTML的标签名来选择,比如:

p{font-size: 15px}

那么应用了这个CSS的HTML页面的所有p标签的字体大小都被设为了15像素。

类选择器和id选择器相似,唯一的区别就是id在一个页面中只能出现一次,而class可以出现多次。比如以下HTML代码:

<div id="div1">一段文字</div>

它对应的CSS代码为:

#div1 { font-size:18px}

这就是ID选择器,下面的代码是类(class)选择器:

<div class="div1">一段文字</div>

对应的CSS就是:

.div1 { font-size:16px}

下级选择器则是选择某个匹配元素的下级元素,比如以下代码:

<div id="head">

<p>一段文字</p>

<div>另一段文字</div>

</div>

应用以下CSS:

#head p { font-size: 15px}

那么p标签中的文字字体大小为15像素,而div标签中的字体是默认大小。

另外还有子选择器等6种选择器,不过因为低版本的IE浏览器不兼容,所以一般不用。你作为新手,建议你先把CSS的基本概念搞懂,然后自己多操作,很快就能搞懂了