waterv 2020-03-07
实体符(以&开头,以;结尾)
< <;
> >;
版权© ©;
空格  ;
1 <em>倾斜</em> 2 <strong>加粗</strong> 3 <del>删除线</del>
不常用
<div>
<!-- 容器 -->
这是头部
</div>
<div>
这是主体
</div>
<div>
这是<span>尾部</span><!--局部-->
</div><style>
span{
font-size: 26px;
}
</style>
css (cascading stylesheet 负责页面的样式)
1、行内样式
1 <!-- 行内样式 --> 2 <p style="font-size:20px; color:red;">书山有路勤为径</p>

2、内嵌式
1 <div> 2 我是一个div 3 </div>
<style type="text/css">
div{
width: 100px;
height: 100px;
background-color: orange;
}
/*嵌入式 内嵌式 */
</style>
3、外接式(link写在head内)
1 <link rel="stylesheet" href="index.css"> 2 <!-- rel表示外部文件和样式表的关系 -->

index.css令创一个css文件,通过link链接

作用与1和2相同.
css语法
选择器 {
K:V;
K:V;
K:V;
}
*1 选择器 选中元素(标签)
*2 各种属性
选择器
1、基本选择器
标签选择器
div {
}
h2 {
}
类选择器 (推荐经常使用)
<p class="p1">第一段</p>
<div>
<div>
<div>
<div>
<p>我隐藏的比较深</p>
</div>
</div>
</div>
</div>
<h2 class="p1 h2">二级标题</h2>
<p class="h2">文字居中</p>.p1{
background-color: red;
}
.h2{
text-align: center;
/* 让文字水平居中 */
}
id选择器
<p>这是段落</p>
<p id="p2">这是段落</p>
<p>这是段落</p>
<div id="box">这是一个容器标签 可以放其他元素</div><style>
#p2{
background-color: red;
}
#box{
font-size: 30px;
}
</style>
