首页 > 代码库 > 20161108
20161108
学习了边框，外边距，内边距，了解了标签的优先级，同时学习了margin的用法。练习了标题标签，段落标签，换行标签的用法。
笔记：
优先级：特指的优先级大于泛指的优先级，优先唯一性，例如id>class>div优先级关系
border 边框
margin 外边距
padding 内边距
外边距设置顺序为从上开始顺时针，不设置距离的话默认距离为对边的宽度
或者使用margin-top margin-right margin-bottom margin-left来设置
margin:0 auto表示居中
设置多个div可以先建立一个大的div，使他们成为一个整体，再移动
border-radius改变圆角可以做出圆
inde.html代表网站的首页
<h1></hi>成对出现，标题标签
<p></p>成对出现，段落标签
<br>换行标签
<p>与<br>区别就是使用<p>会多空一行
段落的开头打空格有两种方法：
1.使用text-indent:30px进行缩进，写在<style></style>里面
2.使用html实体，可以查询实体
实现：
1.居中四个方块：
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
#b{
width: 250px;
height: 250px;
margin: 0 auto;
}
.a{
width: 100px;
height: 100px;
background-color: #ff0000;
float: left;
margin: 10px;
border-radius: 10px;
}
#c{
background-color: #00ff00;
}
#d{
background-color: #0000ff;
}
#e{
background-color: black;
}
</style>
</head>
<body>
<div id="b">
<div class="a"></div>
<div class="a" id="c"></div>
<div class="a" id="d"></div>
<div class="a" id="e"></div>
</div>
</body>
</html>
2.段落，缩进，标题的运用
<!DOCTYPE html>
<html>
<head>
<title>13个三分！库里打破NBA单场三分命中纪录</title>
<style>
div{
width: 700px;
/*background-color: blue;*/
/*color: red;*/
font-size:100%;
}
p{
text-indent: 30px;
}
</style>
</head>
<body>
<div>
<h1>13个三分！库里打破NBA单场三分命中纪录</h1>
<p style="color:yellow">北京时间11月8日消息，斯蒂芬-库里早已被视为历史上最棒的三分投手，所有人都期待着他创造单场三分球命中纪录的时刻。终于这一天到来了，在勇士<br>116比106战胜鹈鹕的比赛中，库里投中13个三分球创造了历史新纪录，他打破了自己、科比和马绍尔三人一同保持的纪录。</p>
<p>上一场做客对阵湖人，库里在三分线外哑火，10投0中，这让他连续157场至少投中一个三分球的纪录作古。或许正是这一纪录被终结给了库里更多动力，他在甲骨文球馆送出了爆发性表现。</p>
</div>
</body>
</html>
20161108