img、列表和table标签
生活随笔
收集整理的這篇文章主要介紹了
img、列表和table标签
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
一、img圖片
<body><a href="https://www.fmtxt.com"><img src="images/1.jpg" title="哆啦A夢" style="height: 200px; width: 200px " alt="哆啦A夢"/></a> </body>'''1. 放在 a 標簽中，點擊圖片就能跳轉到鏈接的網站2. src : 圖片的位置3. title：當鼠標放置在圖片上時顯示的內容4. alt：當圖片不能打開時，顯示的內容 '''注： img 標簽默認會自帶1px的邊框，可以使用樣式 boder:0 去掉這個邊框
二、列表標簽
2.1 ul標簽
說明：ul=>unordered lists 無序列表，跟li標簽配合著使用
<body><ul><li>1</li><li>2</li><li>3</li></ul> </body>如下：
2.2 ol標簽
說明：ol=>ordered lists 有序列表，也是跟li標簽配合著使用
<body><ol><li>Python</li><li>Html</li><li>Linux</li></ol> </body>如下：
2.3 dl標簽
? dl=>defintion list 定義一個列表?? 配合著dt=>defintion title(定義標題)和dd=>defintion description(描述)兩個標簽配合使用
<dl><dt>浙江</dt><dd>杭州</dd><dd>金華</dd><dd>嘉興</dd><dt>江蘇</dt><dd>蘇州</dd><dd>南京</dd><dd>無錫</dd></dl>如下：
三、table標簽
3.1 tr 和 td
<table border="1"><tr><td>姓名</td><td>年齡</td><td>地址</td></tr><tr><td>張三</td><td>22</td><td>北京</td></tr><tr><td>李四</td><td>22</td><td>上海</td></tr></table>'''1. tr : 表示行2. td： 表示列 '''如下：
3.2 規范的表格寫法?
<table border="1"><thead><tr><td>表頭1</td><td>表頭2</td><td>表頭3</td><td>表頭4</td></tr></thead><tbody><tr><td><a href="https://www.baidu.com">1</a></td><td>1</td><td>1</td><td>1</td></tr><tr><td>1</td><td>1</td><td>1</td><td>1</td></tr><tr><td>1</td><td>1</td><td>1</td><td>1</td></tr></tbody>'''thead：表頭tbody：內容a標簽：為表格中內容做鏈接'''如下：
3.3 合并單元格--列之間合并
<thead><tr><td>表頭1</td><td>表頭2</td><td>表頭3</td><td>表頭4</td></tr></thead><tbody><tr><td>1</td><td colspan="2">1</td><td>1</td></tr><tr><td>1</td><td>1</td><td>1</td><td>1</td></tr></tbody>'''colspan="2"：表示占兩列， 同時要刪去一列 '''如下：
3.3 合并單元格--行之間合并
<tbody><tr><td rowspan="2">1</td><td>1</td><td>1</td><td>1</td></tr><tr><td>1</td><td>1</td><td>1</td></tr></tbody>'''rowspan="2"：表示橫跨兩行，同時要在下一行中刪去一列 '''如下：
?
更多專業前端知識，請上 【猿2048】www.mk2048.com
總結
以上是生活随笔為你收集整理的img、列表和table标签的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 模态对话框和全选反选
- 下一篇： EasyUI加zTree使用解析 eas