CSS书写位置和基础选择器

1.CSS的书写位置

1.行内式:(优先级最高)
格式:<标签 style=“属性:值;属性:值:…”>

<p style="color:orange;text-align:right">CSS基础案例p>

2.内嵌式:

格式:
选择器{
属性:值;

}

	<style>
        /* CSS代码就是写在style标签中的 */

        /* p:选择器,用来选中页面中所有的p标签 */
        p{
            /* color:设置文字颜色的属性 */
            color:red;
            /* text-align:设置文本的对齐方式(left center right) */
            text-align:center;
            /* font-size:设置文字字体大小 */
            font-size:20px;
        }
    style>

3.外链式

<link href="common.css"/>

2.CSS基础选择器

标签选择器

能够一次性选中页面中的所有标签,但不能个性化设置。

	p{
        color:red;
     }

id选择器

每个标签都有id属性,id的值在整个页面唯一,但不能一次选中多个标签

<p id="p1">例子p>
#p1{
	color:red;
}

类选择器

每个标签都有class属性,不同标签的class值可以相同,可以选中多个标签

<p class="red">例子p>
<h1 class="red">例子h1>
.red{
	color:red;
  }

优先级:id选择器>类选择器>标签选择器

多类名

一个class属性可以同时设置多个值,类名之间用空格分隔

通配符选择器

*,能够选中页面中的所有标签

*{
	margin:0;
	padding:0;
}

3.选择器的几个特性

层叠性

多个选择器设置的样式可以叠加在同一个标签上,当出现冲突时,权重高的优先,权重相同就近原则

继承性

子标签会继承父标签的某些样式:
text-,font-,line-,color

你可能感兴趣的:(html,css,js,css,前端)