HTML模板
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文档标题</title>
<link rel="stylesheet" type="text/css" href="mystyle.css">引入外部文件</link>
<style type="text/css">CSS代码区</style>
</head>
<body>
<h1>一号标题</h1>
<p>段落</p>
<script>JS代码区</script>
</body>
</html>
1.窗体
窗体作为前端的显示块,一个页面就是一个窗体,一个模态框也是一个内层窗口
2.布局
前端的ui搭建需要有规则的排列
html的布局主要有3种 普通,浮动,定位
1.普通布局
【普通布局就是利用标签的自身特性进行排列】
行级标签: 此类标签比较卑微,一行可以挤多个 无法设置宽高
块级标签: 此类标签比较霸道,一个标签占一行 可以设置宽高
行内块级标签:此类标签本质就是卑微的行级标签,但是它是可以设置宽高的
2.浮动布局
【浮动布局就是对块级标签的升级版】
回顾一下
块级标签: 此类标签比较霸道,一个标签占一行 可以设置宽高
特别霸道,一个标签占一行,有没有办法俩个块级标签放一行啊
float:left
float:right
当然可以,上面这俩个属性可以让块级标签在一行,且指定它在一行中的靠左还是靠右
3.定位布局
【定位布局就是忽略元素的特性进行自定义的布局】
我既不想用【普通布局】也不想【浮动布局】,我就指定某个元素在某个位置
这个就是【定位布局】
定位布局有以下四种方式