HTML-图片标签和列表标签

图片标签

图片标签:

  • img:展示图片
    • 属性:
      • src:指定图片的位置　　　

路径为相对路径

  • 以开头的路径
    • ./：代表当前目录 ./image/1.jpg
    • ../:代表上一级目录　　　　

列表标签

有序列表:

  • ol:
  • li:

无序列表:

  • ul:
  • li:

HTML代码

复制代码
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>列表</title>
    </head>
    <body>
        <!-- 有序列表 -->
        <ol type="A" start="5">
            <li>睁眼</li>
            <li>看手机</li>
            <li>穿衣服</li>
            <li>洗漱</li>
        </ol>
        
        <!-- 有序列表 -->
        <ol type="1">
            <li>睁眼</li>
            <li>看手机</li>
            <li>穿衣服</li>
            <li>洗漱</li>
        </ol>
        
        <!-- 无序列表 -->
        <ul>
            <li>睁眼</li>
            <li>看手机</li>
            <li>穿衣服</li>
            <li>洗漱</li>
        </ul>
        
        
        <!-- 无序列表 -->
        <ul type="circle">
            <li>睁眼</li>
            <li>看手机</li>
            <li>穿衣服</li>
            <li>洗漱</li>
        </ul>
        
        <!-- 无序列表 -->
        <ul type="disc">
            <li>睁眼</li>
            <li>看手机</li>
            <li>穿衣服</li>
            <li>洗漱</li>
        </ul>
        
        <!-- 无序列表 -->
        <ul type="square">
            <li>睁眼</li>
            <li>看手机</li>
            <li>穿衣服</li>
            <li>洗漱</li>
        </ul>
    </body>
</html>
复制代码

运行结果

posted @   baimingze  阅读(105)  评论(0)  编辑  收藏  举报
相关博文：
· HTML-语义化标签和表格标签
· HTML-链表标签和块标签
· HTML标签图片标签和列表标签
· HTML标签图片和列表标签
· HTML标签_图片标签和HTML标签_列表标签
阅读排行：
· Manus重磅发布：全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后，我竟然真的恢复了删除的微信聊天记录！
· 没有Manus邀请码？试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
点击右上角即可分享
微信分享提示