79 lines
1.3 KiB
HTML
79 lines
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
<title>css 学习</title>
|
|
<!-- <link rel="stylesheet" href="css/index.css"> -->
|
|
<style>
|
|
* {
|
|
color: #8d8d8d;
|
|
}
|
|
.blue {
|
|
color: blue;
|
|
}
|
|
.red {
|
|
color: green;
|
|
}
|
|
.green {
|
|
color: green;
|
|
}
|
|
|
|
.header h2,
|
|
.footer h2{
|
|
font-size: 100px;
|
|
}
|
|
.font14 {
|
|
font-size: 14px;
|
|
}
|
|
.colorGreen {
|
|
color: green;
|
|
}
|
|
|
|
a {
|
|
color: chocolate;
|
|
}
|
|
a:hover {
|
|
color: yellow;
|
|
font-size: 24px;
|
|
}
|
|
.ser {
|
|
width: 100px;
|
|
transition: all 1s ease-in;
|
|
}
|
|
.ser:focus {
|
|
width: 200px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<!-- <p class="blue">我是p标签1</p>
|
|
<p class="red">我是p标签2</p>
|
|
<p class="green">我是p标签3</p>
|
|
<p class="red">张三</p>
|
|
|
|
<p id="UserName">你好1</p>
|
|
|
|
<h2>dddd</h2>
|
|
|
|
<a href="">dddd</a> -->
|
|
|
|
|
|
<div class="header colorGreen font14">
|
|
<h2>我是头部</h2>
|
|
</div>
|
|
|
|
<div class="footer font14">
|
|
<h2 class="font14">我是版权</h2>
|
|
</div>
|
|
|
|
<a href="">hover悬浮</a>
|
|
|
|
<input class="ser" type="text" placeholder="请输入用户名">
|
|
|
|
|
|
</body>
|
|
</html> |