<!DOCTYPE html> <!--#浏览器的兼容模式--> <html lang="en"> <head> <!--head标签包含的子标签--> <meta charset="utf-8"> <!--meta标签 name属性主要用于描述网页，与子对应的值为content，content中的主要内容是便于搜索引擎 查找信息和分类信息用的--> <meta name="keywords" content="关键词seo"> <meta name="description" content="描述词"> <!--Refresh 页面定时刷新 http-equiv:相当于http文件头作用，他可以向浏览器传回一些 有用的信息，以帮助正确和精确的显示网页内容，与之相对应得属性为content，内容其实是各个参数的变量值--> <!--<meta http-equiv="Refresh" content="2;URL=https://www.baidu.com">--> <!--<meta http-equiv="content-type" charset="utf-8">--> <!--link标签 引入资源--> <link rel="icon" href="http://www.jd.com/favicon.ico"> <link rel="stylesheet" href="css.css"> <script src="xxx"></script> <title>test</title> </head> <body> <input name="pwd" type="text" readonly> <p id="abc">顶部</p> 换行<br> <strike>加线</strike> <strong>加粗1</strong> <h1 style="color:red"><p>xxwdwewefwfr</p>hello</h1> <div>hello</div> <span style="color:green;">hello span</span> 水平线<hr> <!--块级标签:<p> <h1> <table> <ol> <ul> <form> <div> 和内联便签: <a> <input> <img> <sub> <span> <texttra>--> 块级标签（block）：独占一行，总是在新行上面开始，宽度缺省是他容器的100%，除非设定一个宽度，他可以容纳内联元素和其他快元素 内联标签：不独占一行,和其他元素都在一行上，宽度就是他文字或者图片的高度，不可改变，内联元素只能容纳文本和其他内联元素 特殊字符： 。。。。 xxx 111 <ul> <li>无序列表</li> </ul> <ol> <li>有序列表</li> </ol> <dl> <dt>自定义列表</dt> <dd></dd> </dl> <a href="#abc" target="_blank">返回顶部</a> </body> <script>alert(widows.top.document.compatMode)</script> </html> <!--超文本:就是指页面内可以包含图片，链接，甚至音乐，程序等非文字元素--> <!--标记语言：标记<标签>构成的语言--> <!--标签的属性 1.通常都是以键值对的方式出现 2.属性只能出现在开始标签和自闭和标签 3.属性名全部小写，如果属性名和属性值完全一样，直接写 属性名即可-->
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>注册页面表单</h1> <form action="1.php" method="post" enctype="multipart/form-data"> <p>用户名<input type="text" name="username" placeholder="请输入用户名" disabled></p> <p>密码<input type="password" name="pwd"></p> <p>爱好 音乐<input type="checkbox" name="hooby" value="音乐" checked> 看书<input type="checkbox" value="看书"></p> <!--radio单选按钮取决于属性name-- value：选框对应的值--> <p>性别 男<input type="radio" name="gender" value="boy" > 女<input type="radio" name="gender" value="girl"></p> 省份<select name="provie" multiple size="2"> <!--mutiple多选 size设置显示个数 selected默认选中--> <option value="sichuang" selected>四川</option> <option value="dong">广东</option> <option value="xi">山西</option> </select> <!--<select name="provie" multiple size="2">--> <!--<!–mutiple多选 size设置显示个数 selected默认选中–>--> <!--<option value="sichuang" selected>四川</option>--> <!--<option value="dong">广东</option>--> <!--<option value="xi">山西</option>--> <!--</select>--> 简介<textarea name="desc" cols="10" rows="5"></textarea> <label for="www">姓名</label> <input type="text" id="www"> <input type="submit" value="注册" > <input type="button" value="按钮"> <br> <input type="reset" value="重置"> 只读 <input type="text" readonly><br> 文件上传<input type="file" name="putfile"> <!--file提交文件，from表单上必须要加上属性enctype=“multipart/form-data”--> <!--name：表单提交项的键，注意和id的区别：name属性是和服务器通信时使用的名称，而id属性是浏览器使用的名称，该属性主要方便客户端 而在css和javascript中使用 value:表单提交项的值，对于不同的输入类型，value属性的用法也不同--> </form> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表格</title> </head> <body> <table border="1px solid" cellpadding="50px" cellspacing="5px" > <thead> <tr> <th>1</th> <th>2</th> <th>3</th> </tr> </thead> <tbody> <tr> <td>xxx</td> <td colspan="2">xxxx</td> </tr> </tbody> </table> </body> </html>