day-13 web前端

前端用到html css js

html

1.html简介

<!DOCTYPE html>
<html>
<head>
<meta charset="utf8"/>
<title>女神</title>
<style>
.lvmao{
color: greenyellow;
}

</style>
</head>
<body>

<!--
h1~h6
div
span
a
img
ul
li
ol
li
table
form

文本级的标签：h1~h6 独占一行 span:小跨域的标签
-->
<h1>女神开车去西二旗见金老板</h1>
<h2>女神开车去西二旗见金老板</h2>
<h3>女神开车去西二旗见金老板</h3>
<h4>女神开车去西二旗见金老板</h4>
<h5>女神开车去西二旗见金老板</h5>
<h6>女神开车去西二旗见金老板</h6>
女神开车去西二旗见<span class="lvmao">金老板</span>
<span>女神开车去西二旗见金老板1</span><span>女神开车去西二旗见金老板2</span>

</body>
</html>

2. head标签中的相关标签

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
/*
选择器: 基础选择器和高级选择器
标签选择器
*/
html{
/*css的继承只有个别的属性 color font-xxx text-xxx line-**/
color: #fff;
font-size: 14px;
/*text-align: center;*/
}
body{
margin: 0;
}
.top{
width: 100% ;
height: 40px;
background-color: black;
color: #fff;
/*让文本水平居中*/
/*text-align: center;*/
line-height: 40px;
}
.header{
width: 100%;
height: 100px;
background-color: red;
}
.content{
width: 100%;
/*height: 2000px;*/
background-color: mediumpurple;
}
.footer{
width:100%;
height: 400px;
background-color: grey;

}
/*.hei{*/
/*width: 100px;*/
/*height: 40px;*/
/*background-color: red;*/
/*overflow: hidden;*/
/*}*/

.container{
width: 1226px;
height: 100%;
/*background-color: transparent;*/

/*让盒子水平居中*/
margin-left: auto;
margin-right: auto;
}

</style>
</head>
<body>

<div class="top">
<div class="container">
top黑色区域
</div>
</div>
<div class="header">
<div class="container">
导航区域
</div>
</div>
<div class="content">
<div class="container">
主体内容区域
</div>
</div>
<div class="footer">
<div class="container">
脚后跟
</div>
</div>

</body>
</html>

<!--
h1~h6：标题标签
span
div：division 分割块区域
a
img
ul
li
ol
li
table
form

-->

猜你喜欢