如何进修html的各类标签(2)

<!DOCTYPE html><html> <head><meta charset="utf-8" /><meta content="width=device-width, initial-scale=1"> <title>body标签(列表标签)</title> </head><body> <h3>列表的进修</h3> <hr > <h3>无序列表</h3> <ul><li>北京</li> <li>广州</li ><li>上海</li> <li>西安</li> </ul><h3>有序列表</h3> <ol type="A"> <li>xx</li> <li>hh</li> <li>ll</li> <li>qq</li> </ol> <dl><dt>java</dt> <dd>python</dd> <dd>go</dd> <dd>shell</dd> <dt>hh</dt> <dd>aa</dd> <dd>xx</dd> <dd>ll</dd></dl></body></html>

图片标签进修

img src :

图片路径

当地资源路径:一般当舆图片资源利用相对路径即可网络资源路径:图片资源的URL地点

属性

width:配置图片的宽度,假如是单独配置,则再图片担保不失真的环境下自动缩小可能放大;单元可以是px也可以是百分比height :配置图片的高度,假如是单独配置,则再图片担保不失真的环境下自动缩小可能放大;单元可以是px也可以是百分比title:图片标题,鼠标放在图片上的时候会显示alt:图片加载失败后的提示语

留意:图片是不会自动换行的(行内元素)

代码粘贴

<html> <head> <meta charset="utf-8"/> <title>图片标签进修</title> </head> <body> <h3>图片标签进修</h3> <hr > <img src="https://www.jb51.net/article/D:/" title="hanpi" alt="shabi"> <img src="https://www.jb51.net/article/img/1.jpg" title="shabi" alt="hanpi"> <img src="https://www.jb51.net/img/2.jpg" > <hr > <img src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3767793794,672931879&fm=26&gp=0.jpg" > </body> </html>

超链接标签进修 a标签

href :要跳转的网页资源路径
当地资源:相对路径
网络资源:网络资源(网页)的URL

target :指明要跳转的网页资源的显示位置

_self 在当前页中刷新显示_blank 在新的标签页中显示_top 在顶层页面中显示_parent 在父级页面中显示 锚点进修

浸染:在一张网页中举办资源跳转

利用:

先利用超链接标签在指定的网页位置增加锚点.名目为:<a#锚点名" >会见方法/a>

代码粘贴

#超链接 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>超链接</title> </head> <body> <h3>超链接标签</h3> <hr > <a href="图片标签 .html" target="_blank">图片标签</a> <hr > <a href="https://www.jb51.net/body标签(列表标签).html" target="_parent"><img src="https://www.jb51.net/img/1.jpg" ></a> <hr > <a href="https://www.baidu.com" >baidu</a> <h3>锚点进修</h3> <a href="https://www.jb51.net/锚点进修.html" >锚点进修</a> </body> </html> #锚点进修 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>锚点进修</title> </head> <body> <a href="#first" >第一章</a><br> <a href="#second" >第二章</a><br> <h5>第一章</h5> <a></a> <p> 啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦 </p> <p> 啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦 </p> <p> 啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦 </p> <p> 啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦 </p> <h5>第二章</h5> <a></a> <p> 哈哈哈哈哈哈哈哈哈哈或或或或或或或或或或或或或或或或或或或或或或或或或 </p> <p> 哈哈哈哈哈哈哈哈哈哈或或或或或或或或或或或或或或或或或或或或或或或或或 </p> <p> 哈哈哈哈哈哈哈哈哈哈或或或或或或或或或或或或或或或或或或或或或或或或或 </p> <a href="#" >回到顶部</a> </body> </html>

表格标签的进修

table :声明一个表格

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wsjxjw.html