html -基础标签
<!DOCTYPE html> <!DOCTYPE这是一个版本声明 --> <html> <!--网页使用的语言 --> <head> <!--给浏览器的一些信息--> <meta charset="utf-8"> <!--编码格式--> <title>虎哥最帅</title> <!--title网页的标题--> </head> <body> <!--body就是网页内部的内容--> <!--1 a标签 href:超链接--> <a href="http://www.baidu.com">虎哥最帅</a> <a href="http://www.jianshu.com">向阳最丑</a> <!--标签总结:标签分为两种,一种是单标签,一种是双标签,a就是双标签,meta就是单标签, 双标签是可以添加内容的,单标签不可以添加内容--> <!--h标签 标记标签 h1到h6--> <h1>0601班最棒.</h1> <h2>但是虎哥最帅</h2> <h3>向阳最丑</h3> <h4>吴坤最污</h4> <h5>小歪最好</h5> <h6>我是h6</h6> <!--h1+h2+h3+tab键--> <h1></h1> <h2></h2> <h3></h3> <!--ul无序标签 ol有序标签--> <!--ul>li*3 创建3个ul标签--> <!--ul>li{我是无序$}*3+Tab--> <ul> <li>我是无序标签1</li> <li>我是无序标签2</li> <li>我是无序标签3</li> <li>我是无序标签4</li> <li>我是无序标签5</li> </ul> <hr /> <ol> <li>我是有序标签1</li> <li>我是有序标签2</li> <br /> <li>我是有序标签3</li> </ol> <!--br:换行标签--> <br /> <!--hr:水平换行符--> <hr /> <!--p:段落标签 内容单独为一行--> <p>胡歌最帅</p> <p>呆,妖精,看法宝,我给你看看我的宝贝</p> <!--div标签 没有语义,主要的作用用来做网页的布局,需要和css配合使用--> <div id=""> 我是div </div> <div id=""> 我是div2 </div> <!--tab标签,表格标签,非常重要的标签--> <!--border:边框线的宽度,cellspacing:单元格之间的间距 cellpadding:单元格和边框线的间隔--> <!--tr:行数 td:单元格 th:表头单元格--> <table border="1" cellspacing="1" cellpadding="1"> <tr> <th>表头1</th> <th>表头2</th> </tr> <tr> <td>单元格1</td> <td>单元格1</td> </tr> <tr> <td>单元格2</td> <td>单元格2</td> </tr> </table> <table border="1" cellspacing="1" cellpadding="1"> <tr> <th>三月份</th> <th>四月份</th> <th>五月份</th> <th>六月份</th> </tr> <tr> <td>C</td> <td>OC</td> <td>UI</td> <td>高级+项目</td> </tr> </table> <!--img标签 src:图片网址(可以是本地的 也可以是网络的),alt:图片没有加载完成之前显示的图片 title:鼠标点击时的显示的内容提示--> <!--图片路径:下一级: ./ 上一级: ../--> <img src="3.png" alt="" title="李白"/> <!--标签分类: 1.块属性 *块属性标签默认宽度是屏幕的宽度. *块属性标签可以设置宽高 *块属性可以嵌套块属性标签和行属性标签. *属于块属性标签的有:p,div,h1-h6,ul,ol,li,table,tr, 2.行属性 *行数行标签在一行内显示 *行属性标签默认内容撑开宽高. *行属性标签大部分不能设置宽高,除了image,input. *行属性嵌套,只能嵌套行属性标签. *属于行属性标签的有:a,img,strong,span,input,--> <!--form 表单标签--> <!--action:数据接口 method:选择请求方式,get和post input:类型 name:相当于我们请求地址中的key值 value:服务器用到的参数--> <form action="http://www.baidu.com" method="get"> 用户名:<input type="text" name="userName" placeholder="请输入账号" value="" /> 密码:<input type="text" name="password" placeholder="请输入密码" value="" /> 提交<input type="button" name="" id="" value="确认信息" /> <input type="submit" value="提交"/> </form> <!--select :下拉菜单 value 告诉后台值的--> <select name="sex"> <option value="1">男</option> <option value="0">女</option> <option value="orz">李诵</option> </select> <br /> <!--radio样式:单选框 name必须是一样的否则时可以进行多选的.--> <input type="radio" name="虎哥" id="" value="0" />帅 <input type="radio" name="虎哥" id="" value="1" />更帅 <input type="radio" name="虎哥" id="" value="2" />超帅 <br /> <!--checkbox样式:多选框--> <input type="checkbox" name="" id="" value="0" />小学 <input type="checkbox" name="" id="" value="1" />初中 <input type="checkbox" name="" id="" value="2" />高中 <input type="checkbox" name="" id="" value="3" />大学 </body> </html>