HTML5的列表&超链接&相对路径&图片标签

文章目录

  • 1、HMLT5的列表
  • 2、超链接
    • 2.1 相对路径
    • 2.1 超链接其他用法
  • 3、图片标签
    • 3.1 图片格式


提示:以下是本篇文章正文内容,下面案例可供参考

1、HMLT5的列表

代码如下(示例):

<body>
    
    <ol>
        <li>炸鸡li>
        <li>麻辣烫li>
        <li>烧烤li>
    ol>
    <ul>
        <li>炸鸡li>
        <li>麻辣烫li>
        <li>烧烤li>
    ul>
    <dl>
        <dt>炸鸡dt>
        <dd>韩式辣酱、烧烤酱、蜂蜜芥末酱dd>
    dl>
body>

展示:
HTML5的列表&超链接&相对路径&图片标签_第1张图片

2、超链接

代码如下(示例):

<body>
    
    <a href="https://blog.csdn.net/buxiangquaa?spm=1000.2115.3001.5343">外部超链接a>
    <a href="同一目录.html">内部超链接a>
body>

2.1 相对路径

代码如下(示例):

<body>
    
body>

2.1 超链接其他用法

代码如下(示例):

<body>
    
    <a href="#bottom" target="_blank"> 去底部a>
    
    <a href="#1">去p的自然段a>
    <p id="1">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Laudantium eligendi nobis tempora, voluptas nostrum doloremque quis deserunt adipisci veritatis? Vitae magni error sunt labore voluptas omnis magnam. Tenetur, sequi quam!p>
    
    <a id="bottom" href="#">回到顶部a>
   <a href="javascript:;">a>
body>

3、图片标签

代码如下(示例):

<body>
  
   <img src='./img/1.gif' alt="">
   <img width="200" src="网站图片可以直接复制地址">
body>

3.1 图片格式

(1)jpeg(jpg):支持的颜色比较丰富,不支持透明效果,不支持动图,一般用于显示照片。
(2)gif:支持的颜色少,支持简单透明,支持动图,适合颜色单一的图片、动图。
(3)png:支持颜色丰富,支持复杂透明,不支持透明,适用于网页
(4)webp:谷歌推出的专门用于网页中的一种格式,具备其他图片格式的所有优点,而且文件还特别小。但是!兼容性不好。
(5)base64:将图片使用base64进行编码,可以将图片转化为字符,通过字符的形式引入图片,需要和网页一起加载时才会使用。(网上有在线转化的)
(4)效果与大小要会抉择

你可能感兴趣的:(HTML5的列表&超链接&相对路径&图片标签)