本节课紧张讲解一些html的常用标签,html有很多标签跟属性,大家可以去w3c网站看,
我们紧张讲解一些常用的标签和属性,网页的框架是由布局文标签+css来设定的,表单标签是可以供应输入、选择等操作,媒体标签紧张是图片音视频。
视频加载中...
<!DOCTYPE html><html><head><meta charset=\公众utf-8\公众><meta name=\"大众viewport\公众 content=\"大众width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0\"大众 /><title>常用html标签-老雷php全栈开拓教程</title><style>.table{width: 100%;border-collapse: collapse;}.table td,.table th{border: 1px solid #eee;padding: 5px;}.mgb-10{margin-bottom: 10px;}</style></head><body><div><div>参考 <a href=\"大众http://www.w3school.com.cn/html/index.asp\"大众 target=\公众_blank\"大众>http://www.w3school.com.cn/html/index.asp</a> </div><h3>布局文本</h3><div><div>最常用的布局标签div<br>任何页面布局都可以利用div+css实现<div style=\公众font-size: 16px; color: red;\"大众 class=\"大众这是class\"大众 id=\公众这是id\公众 title=\"大众鼠标提示\"大众 data-title=\公众这是值\"大众>属性解释</div><div></div><img /></div></div><p>这是一个段落p</p><p>这个是会换行的</p><div><span>这是一个行内标签span</span><span>这是不会换行的</span></div><pre>这是一行 这是第二行这是第三行</pre><h3>页面切换</h3><div><a href=\公众index.html?m=a\"大众>A</a><a href=\"大众index.html?m=b\"大众>B</a><a href=\"大众index.html?m=c\"大众>C</a></div><h3>html注释</h3><!-- 在此处写注释 --><div><!-- 在此处写注释 --></div><h3>标题</h3><div><h1>h1</h1><h2>h2</h2><h3>h3</h3><h4>h4</h4></div><h3>列表</h3><div><div>无序列表</div><ul> <li>咖啡</li> <li>茶</li> <li>牛奶</li></ul><div>有序列表</div><ol> <li>咖啡</li> <li>牛奶</li> <li>茶</li></ol><div>定义列表</div><dl> <dt>打算机</dt> <dd>用来打算的仪器 ... ...</dd> <dt>显示器</dt> <dd>以视觉办法显示信息的装置 ... ...</dd></dl><div><div>打算机</div><div style=\"大众margin-left: 60px;\"大众>用来打算的仪器 ... ...</div><text></text></div></div> <h3>表格</h3><table class=\"大众table\公众><thead><tr><th>这是表头</th><th>这是第二列</th></tr></thead><tbody><tr><td>这是第一列</td><td>这是第二列</td></tr></tbody></table><h3>媒体</h3><div><img src=\公众http://www.w3school.com.cn/i/eg_cute.gif\"大众 alt=\"大众图片不存在\"大众 /><audio src=\"大众http://www.w3school.com.cn/i/horse.mp3\"大众 controls=\公众controls\公众></audio><video controls=\"大众controls\"大众 src=\"大众http://www.w3school.com.cn/i/movie.ogg\"大众></video></div><h3>表单</h3><form><div class=\"大众mgb-10\公众><input type=\公众text\公众 id=\公众title\"大众 name=\"大众title\"大众 value=\"大众\"大众 placeholder=\"大众这是单行文本框\公众 /><input type=\公众hidden\"大众 /></div><div class=\"大众mgb-10\"大众><textarea name=\"大众title\"大众 value=\公众\"大众 placeholder=\公众这是文本框\"大众 >这是多行文本</textarea> </div><div class=\"大众mgb-10\"大众><input type=\公众radio\"大众 class=\"大众gender\公众 name=\"大众gender\"大众 value=\"大众1\"大众 />男<input type=\"大众radio\"大众 checked name=\"大众gender\公众 value=\公众1\"大众 />女</div><div class=\公众mgb-10\"大众><input type=\"大众checkbox\"大众 name=\公众techang[]\公众 value=\"大众1\"大众 /> 音乐<input type=\公众checkbox\"大众 checked name=\"大众techang[]\公众 value=\公众1\"大众 /> 美术</div><div class=\"大众mgb-10\"大众><select name=\"大众select\"大众><option value=\"大众0\公众>这是列表选择框</option><option value=\公众0\"大众 selected=\"大众selected\"大众>选项一</option><option value=\"大众0\"大众>选项二</option></select></div><div class=\公众mgb-10\"大众><input type=\"大众file\公众 name=\"大众file\"大众 />这是文件上传</div><div class=\"大众mgb-10\公众><button type=\"大众submit\"大众>提交</button><button type=\"大众reset\"大众>重设</button><button type=\"大众button\公众>按钮</button></div></form></div><div style=\公众height: 100px;\"大众></div></body></html>