上次我们讲了音频和图片，但是其弊端也是显而易见的。为此，我们就要用到CSS，这里只是浅浅地说一下。当然啦，除了CSS，我们还要讲一个输入框，毕竟很多时候大家在登各种网站时，都会看到“用户名”“密码”一类的输入框，或是“确认”“登录”的按钮。
可能大伙要问为什么不直接用之前的<audio>或是<img src="">，如果你只是做出了自己用用的，那倒也无妨，但如果要把网站做好给别人用，那就要用到今天讲的了。
（大家可以放心，我找别人试验过，别人打开看到的内容和我这边是一样的）
好啦，我们先来了解一下这个CSS，CSS是层叠样式表(Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
在这里我们就挑一部分讲，是关于"div"的。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>范例</title>
<style>
.xx{
width:500px;
height:150px;
background:pink;
position:relative;
top:10px;
left:50px;
z-index:-5;
}
</style>
</head>
<body>
<div class="xx">例子</div>
</body>
</html>上面这个是个简单的例子，接下我会详细讲解。
在<style>中我们可以进行定义，格式为“.”+"任意字母"如".xx"，然后加一个大括号，在里面写代码。
| width | 方框宽度 |
| height | 方框高度 |
| background | 方框的背景颜色 |
| position:relative | 相对定位（此处为默认值） |
| top(bottom) | 相对上下距离 |
| left(right) | 相对左右距离 |
| z-index | 层面（堆叠顺序） |
这个大家可以自己用不同数据自行测试。
接下来说一下这个输入框，"<input type="">"
<div>
用户名：
<input type="text">
</div>
效果是这样的（我背景换成粉的了已经）
这个输入框这次先一笔带过，详细地再讲过。
接下来是按钮。
<html>
<head>
<title>Hoke</title>
</head>
<body>
<button type="submit" id="submit-button">登录</button>
</body>
</html>
就是这么个效果，是可以点击的。
这次就到这里，谢谢浏览，如有不足错误之处还请指出。
7621
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
