标签：选中文字 round 相同 方式 没有 css基础 开发工具 char 引入
CSS：层叠样式表
网页一层一层的。
而css就可以分别为网页的各层设置样式。
（内联样式）放在元素的style属性中。给谁设置写在那个标签里面。
也称为：内联样式，只对当前的元素中的内容起作用。
内联样式不方便复用，不推荐使用。
内联样式属于结构与表现耦合，不方便后期的维护，不推荐使用。
<p style="color:red;font-size:100px;">锄禾日当午，旱地和吓唬</P>（内部样式）将css样式编写在head中的style标签里,然后通过css选择器选择指定元素，然后可以同时为这些元素一起设置样式，这样可以使样式进一步的复用。
将样式表编写到style标签中，也可以使表现和结构进一步分类，使表现和结构进一步分离，推荐使用方式。
<style type="text/css">
p{
color:red;
font-size:100px;
}
</style>（外部样式）表
将样式表编写到外部的css文件中。
编写外部样式css文件
引入外部css样式文件到当前html中。
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>CSS入门</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<p>锄禾日当午，旱地和吓唬</P>
<p>创建明月光，疑似地上霜</p>
</body>
</html>/*
注释内容
*/通过选择器可以选中页面中指定的元素，并且将声明块中的样式应用到选择器对应的元素上。
声明块紧跟在选择器的后边，使用对{}括起来，声明块中实际上就是一组一组的明值对结构，这一组一组的明值对我们称为声明。
在一个声明块中可以写多个声明，多个声明之间使用;隔开。声明的样式名和样式值之间使用：来连接
p{
color:red;
font-size:100px;
}推荐使用的开发工具，见官网文档。
<div style="background-color: red; width: 100px;">one div</div>
<div style="background-color: blue; width: 100px;">two div</div>div、p、h1、h2、h3.。。。
span：没有任何语义，专门用来选中文字，然后为文字设置样式。
内联元素：只占自身大小，不会占用一行。
a、img、span、iframe
块元素：主要用来布局。
内联元素：主要用来选中文本，设置文本样式。
一般请款告知使用块蒜素去包含内联元素，二不会使用内联元素去包含块元素。
，但是除了它本身。
元素(标签)选择器
作用：可以选择页面中的所有指定元素。
p{
color:red;
font-size:100px;
}id选择器
通过元素的id属性值选中唯一的一个元素。
语法：
#p1{
color: green;
font-size: 300px;
}类选择器
可以为元素设置class属性，class属性和id属性类似，只不过class属性可以重复。
用户相同class属性的元素，称为一组元素。
通过元素的class属性，选中一组元素。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>css03</title>
<style>
p{
color:red;
font-size:100px;
}
#p1{
color: green;
font-size: 200px;
}
.p1{
color:greenyellow;
}
.hello{
color: #9932CC;
font-size: 60px;
}
</style>
</head>
<body>
<p>ggggg</p>
<p>ggggg</p>
<p id="p1">ggggg</p>
<p class="p1 hello">ggggg</p>
<p class="p1">ggggg</p>
</body>
</html>class可以同时为一个元素设置多个class属性值，多个值之间用空格隔开。
选择器分组
通过选择器分组可以同时选中多个选择器对应的元素。
语法：选择器1，选择器2，选中N{}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>css03</title>
<style>
p{
color:red;
font-size:100px;
}
#p1{
color: green;
font-size: 200px;
}
.p1{
color:greenyellow;
}
.hello{
color: #9932CC;
font-size: 60px;
}
#p1,h1,.p2{
background: gold;
}
</style>
</head>
<body>
<h1>fd</h1>
<p class="p2">fdfd</p>
<p>ggggg</p>
<p id="p1">ggggg</p>
<p class="p1 hello">ggggg</p>
<p class="p1">ggggg</p>
</body>
</html>通配选择器
可以用来选中页面中的所有元素
*{
color:red;
font-size: 90px;
}作用：可以选中同时满足多个选择器的元素
span.p3{
color: #00008B;
}span与p3中间没有空格。
对id选择器来说，不建议使用复合选择器。
标签：选中文字 round 相同 方式 没有 css基础 开发工具 char 引入
原文地址：https://www.cnblogs.com/newcode/p/9846580.html
