web前端（图片、链接、列表）标签使用

1. 图片
     <img src="./images/bear.jpg" alt="小熊"> 

 2. 链接
    <a href="https://www.zqzip.com" target="_blank">中青网</a> 

 3. 列表；ul+li 无序列表 
    <ul>
        <li>我是无序列表1</li>
        <li>我是无序列表2</li>
        <li>我是无序列表3</li>
    </ul> 

 ol+li ；有序列表
     <ol>
        <li>我是有序列表1</li>
        <li>我是有序列表2</li>
        <li>我是有序列表3</li>
    </ol> 

自定义列表；dl+dt+dd ； dt+dd 名词解释
    <dl> 
       
        <dt>地址: </dt>
        <dd>合肥市政务新区</dd>
        <dt>邮箱:</dt>
        <dd>admin@php.cn</dd>
        <dd>zhulaoshi@php.cn</dd>
    </dl> 

     <!-- 1. 应用场景1: 导航 -->
    <ul class="nav">
        <li class="item"><a href="">link1</a></li>
        <li class="item"><a href="">link2</a></li>
        <li class="item"><a href="">link3</a></li>
    </ul>

    <!-- 2. 图文列表 -->
    <ul class="nav" style="display: flex; list-style: none;">
        <li class="item">
            <a href="#">
                <img src="./images/bear.jpg" alt="">
                <a href="">四个小伙伴</a>
            </a>
        </li>
        <li class="item"><a href=""><a href="#">
            <img src="./images/dog.jpg" alt="">
            <a href="">二个恩爱的小夫妻</a>
        </a></a></li>
        <li class="item"><a href=""><a href="#">
            <img src="./images/duck.jpg" alt="">
            <a href="">孤独的丑小鸭</a>
        </a></a></li>
    </ul>