HTML标签介绍
2018-06-19 本文已影响0人
一个老实人
html:(hyperText markup language) 超文本标记语言。
<html>
</html>
在一个html文件只有一个根标签
注意：以下是我的笔记，有些标签我并没写尾标签。我只为了方便自己使用查看
"  ;"： 空格
"< ;" ：小于符号
"> ;"：大于符号
ol标签（order list）:有序列表
><ol type="1"> <li>xx</li> <li>xx</li> </ol> 在<ol> 标签中type属性可设置排序的类型 默认的是 1 reversed:是倒序， <ol type="I" reversed="reversed" > start:从2开始 <ol type="1" start="2"> 如果你是以字母排序，start：也是数字 <ol type="a" start="2">
ul标签(unorder list):无序列表
<ul> <li>xx</li> <li>xx</li> <li>xx</li> </ul> 他只有一个-type-属性可修改 disc:全写（discircle）默认的 实心圆的意思 <ul type="disc"> 他还有2个值 <ul type="square"> //方块 <ul type="circle"> //空心圆
img 标签:加载图片
设置加载图片的宽高 <img src="<图片地址>" style="width: 200px; height: 200px"> alt（图片占位符）：相当于提示文字，如果图片加载成功是看不来有什么效 图片加载失败的时候才可以看出效果 <img src="img/123.jg" alt="哈哈"> title(图片提示符)：把鼠标放在上的时候，会出现文字信息 <img src="img/123.jg" title="哈哈">
a标签(anchor):可以跳转链接
href（超文本引用）：全称 hyperText reference <a href="链接地址">点我跳转</a> 可以在a标签中应用图片这个图片就有了点击功能 <a href="链接地址"> <img src="img/123.jpg"> </a> 可以设置他的宽高背景颜色等等属性 <a href="链接地址" style="width: 100px;height: 100px;background-color: #ff4400;display: block"> target：这个属性设置为_blank的时候，当用户点击后就会新开一个页面加载 <a href="链接地址" target="_blank">asd</a> 他还可以记录某一个标签的位置: <div id="asd" style="width: 100px; height: 100px; background-color: forestgreen">demoOne</div> <br> X 100//假设这里有100个换行 <div id="zxc" style="width: 100px; height: 100px; background-color: red">demoTwo</div> <br> X 100//假设这里有100个换行 如果我点击one 就会跳到id为asd的位置 <a href="#asd">one</a> 如果我点击two 就会跳到id为zxc的位置 <a href="#zxc">two</a> 电话功能 <a href="tel:电话号码">点我打电话</a> 发邮件功能： 强制执行javascript代码 下面的javascript叫 "协议限定符"，在这个这个后面就可写javascript代码,当你点击后就可以强制执行javascript <a href="javascript:while(1){alert('哈哈')}">点我</a>
form(表单):可以向后端发送数据
method: get/post <form method="get" action="接口链接"> <p> username:<input type="text" name="userName"> </p> <p> password:<input type="password" name="Password"> </p> 提价按钮： <input type="submit"> </form> ---------------------------------------------------- 单选 <form method="get" action=""> 设置input的type=radio可以设置单选按钮 最重要的是要设置>name的值要一样，value就是你设置当前单选对象的值 如果想变成多选把radio 改成checkbox aaa<input type="radio" name="star" value="aaa"> bbb<input type="radio" name="star" value="bbb"> ccc<input type="radio" name="star" value="ccc"> <input type="submit"> </form> ---------------------------------------------------- 在input中为了可以让用户体验跟好，可以设置默认选项checked aaa<input type="radio" name="star" value="aaa" checked="checked"> ---------------------------------------------------- 在form还有个select组键，他和option一起使用，可实现下拉菜单，注意要设置name属性，没有特殊的要求可以不设置value option对应的就是它默认的value。 <form method="get" action=""> <select name="name"> <option>a</option> <option>b</option> <option>c</option> <option>d</option> </select> <input type="submit"> </form> 如果想给每个option设置单独的name 和 value , <option name="xxx" value="1">a</option> 注意如果是想给option 设置单独设置 name 属性，一定要把select中的name 属性去掉。
