html标签

一、图片标签（img）

　　<img  src="./images/pic.png" alt='图片说明'  title='提示文字' >

二、连接标签（a）

　　（1）跳转

　　　　<a  href="http://www.baidu.com">跳转到百度</a>

　　　　<a  href="http://www.baidu.com"  target="_blank">跳转到新页面打开连接地址</a>

　　　　target表示跳转的目标，_blank表示在新的页面中打开

　　（2）下载

　　　　<a  href="./html教程.doc"  download>下载html教程</a>

　　　　download后面不加名称时，文件下载使用默认名称

　　　　<a  href="./html教程.doc"  download="W3Chtml教程">下载W3Chtml教程</a>

　　　　download后面加上名称时，文件下载使用download后面的名称

　　（3）锚点

　　　　 <a  href="#goBottom">点击连接跳到div标签</a>

　　　　<div  id="goBottom"></div>

三、输入框标签（input）

　　（1）文本框（type = text）

 

　　　　 <input  type="text"  placeholder="请输入用户名"/>

　　　　属性：placeholder用来设置 文本框提示文本的

　　（2）密码框（type = password）

　　　　<input  type="password"   placeholder="请输入密码"/>

　　　　属性：placeholder用来设置 文本框提示文本的

　　（3）单选框（type = radio）

　　　　<input  type="radio"  name="组名称">

 

　　　　name值相同，说明2个单选按钮是一组，这样就能够实现只能选一个

　　　　checked表示默认选中

 

　　　　<input  type="radio"  name="sex"  value="man'  checked>男

　　　　<input  type="radio"  name="sex"  value="woman">女

　　（4）复选框（type = checkbox）

　　　　<input  type="checkbox"  value="">

　　　　 checked表示默认选中

　　　　<input  type="checkbox"  value="henan">河南

　　　　  <input  type="checkbox"  value="beijing"  checked>北京

　　　　  <input  type="checkbox"  value="shanghai">上海

四、按钮标签（button）

 

　　<button>写按钮显示的文本</button>

五、div标签（div）

　　<div>块级标签，能够将内容分红一块一块的</div>

　　特色：独占一行，默认宽度占满屏幕，高度随内容撑开

六、无序列表（ul）与有序列表（ol）

　　list-style: none;　　// 清除ul、ol标签中的 圆点符号 和数字符号

　　 list-style:url(../img/aa.png) outside　　// outside表示符号显示在li标签外面

　　list-style:url(../img/aa.png) inside　 // inside表示符号显示在li标签里面　　

七、外部样式标签（link）

　　<link  rel="stylesheet"  href="./css/style.css" />

　　 <link rel="shortcut  icon" href="favicon.ico">　　// 标题上的图标

八、关联标签（label）

 

　　关联标签 通常关联按钮 或 文本框之类的标签，关联之后点击label标签就至关

 

　　于点击的按钮或文本框

　　第一种：<label>请输入姓名：<input type="text"></label>

　　第二种：<label for="KK">请输入姓名</label><input type="text" id="KK">

九、多行文本框（textarea）

　　<textarea  placeholder="请输入留言"></textarea>

　　resize:both  宽度和高度均可以经过文本框右下角三角来进行调整

　　resize:horizontal  宽度能够经过文本框右下角三角来进行调整

　　resize:vertical  高度能够经过文本框右下角三角来进行调整

　　resize:none 宽度和高度都不能够经过文本框右下角三角来进行调整

十、下拉列表标签（select）

　　selected表示默认选中

　　<select>

　　　　<option>选择城市</option>

　　　　<option>上海</option>

　　　　<option  selected>北京</option>

　　　　<option>深圳</option>

　　</select>

input、textarea、select 这些标签在鼠标 选中或输入的时候会出现 边框，咱们能够经过 outline:none去掉这个外框