6.21html

最新推荐文章于 2024-09-06 23:41:09 发布

猎户李铁柱

最新推荐文章于 2024-09-06 23:41:09 发布

阅读量160

点赞数 2

分类专栏： html 文章标签： html servlet java

本文链接：https://blog.csdn.net/asdfg2047/article/details/125390899

版权

html 专栏收录该内容

13 篇文章 1 订阅

订阅专栏

1、列表

列表（list）一组一组

1:有序列表用ol标签创建，li表示列表项

2:无序列表用ul标签创建，li表示列表项

3:定义列表用dl标签创建，使用dd对内容进行解释说明

注意：列表之间是可以互相嵌套的

ol ul dl li 都是块元素

通过type属性更改列表的项目符号

有序列表

项目符号：1（默认值）、a、A、i、I

无序列表

项目符号:

disc，默认值，实心的圆点

square，实心的方块

circle，空心的圆

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 有序标签 -->
    <!-- 默认符号1，还有a,A,I,i -->
    <ol type="i">
        <li>73d</li>
        <li>jsjll</li>
    </ol>

    <!-- 无序标签 -->
    <!-- 默认符号disc实心圆点，还有square实心方块 circle空心圆 -->
    <ul type="square">
        <li>777</li>
        <li>44444</li>
    </ul>

    <!-- 自定义标签 -->
    <dl>
        <dt>uw</dt>
        <dd>ywywywy</dd>
        <dd>gshs</dd>
    </dl>
    
</body>
</html>

2、超链接

<!-- 功能1、一个页面跳到另一个页面

2、当前页面的跳转

3.下载

1.href属性地址

属性值

外部网站的地址绝对路径

内部的页面相对路径

./ 默认值 ./可以省略

同级目录内的地址

../

跳出当前文件夹，来到上一级文件夹内

关键点：你（超链接）在哪里，你要去哪里

2.target属性

可选：_self 默认在当前页面打开

_blank 新开页面打开超链接-->

锚点功能（跳转到页面任意的位置）

1、回到顶部，只需要href属性值设置#

2、去到任意的位置

第一步：要去的位置打个id属性，起个id属性值

第二步：href属性值 #id属性值

id属性给对应的标签打个标记

id属性值不能以数字开头

id属性值是独一无二的存在

id属性值最好不要是汉字

<a href="#">待定</a>
    <!-- 空链接二 -->
    <a href="JavaScript:;">待定2</a>

    <a href="#pp">去底部</a>
    <a href="#中间">去中间</a>
    <div>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p id="中间">
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p>
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
      <p id="pp">
        居婵自丈三生啦看不后李非全之内措，这作你人普都夫年笔才次们设不关年身沫洞，朗专君报不永帝专派问交烦惜种，嗣答想报搏何了了司之楚，韩司对落为应郭惶使德范由而谓付特会，文若评范流情之氏今法房得大京胜国极，为虽未，我起嗣有举人家己么刑十司德不，韩落张若光秦第老。
      </p>
    </div>
    <a href="#">回到顶部</a>
    <a href="JavaScript:;">待定3</a>

3、img

使用img标签来向网页中引入一个外部图片，

img标签也是一个自结束标签

img这种元素属于行内块元素（基于块和行内元素之间，具有两种元素的特点）

4个属性

src 引入图片的地址

alt 图片引入不成的时候，文字提示更重要的作业，浏览器会根据alt值来区分推荐图片

width 控制图片的宽度

height 控制图片的高度度

注意：width和height一般不会同时设置，可能会导致图片的变形

<img src="./img/png/w.gif" alt="11111" height="500px" >

图片的格式

JPEG(JPG)

- JPEG图片支持的颜色比较多，图片可以压缩，但是不支持透明

- 一般用来保存照片等颜色丰富的图片

GIF

- GIF支持的颜色少，只支持简单的透明，支持动态图

- 图片颜色单一或者是动态图时可以使用gif

PNG

- PNG支持的颜色多，并且支持复杂的透明，不支持动图

- 可以用来显示颜色复杂的透明的图片

专为网页而生的

webp

-谷歌新推出的专门用来表示网页的一种格式

-它具有其他图片格式的所有优点，而且文件格式还很小

-缺点：兼容性不好

base64

-讲图片使用base64编码，这样可以将图片转换为字符，通过字符形式来引入

-一般都是需要和网页一起加载的图片才会使用base64

图片的使用原则：

效果不一致，使用效果好的

效果一致，使用小的

网页加载流程

第一次请求：加载网页本身

第二次之后请求，加载外部资源

4、音视频标签

audio标签用来向页面中引入一个外部的音频文件

src 引入音视频路径地址

controls 是否允许用户控制音视频的播放，默认是不允许

loop 循环播放

autoplay 自动播放很多浏览器废弃

<audio src="./source/达拉崩吧.mp3" controls loop autoplay></audio>
    <!-- video标签来向页面中引入一个视频，使用方式跟音频基本上一样的 -->
    <video src="./source/绝地逢生.mp4" controls></video>

猎户李铁柱

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
6.21html

列表（list）一组一组 1:有序列表用ol标签创建，li表示列表项 2:无序列表用ul标签创建，li表示列表项 3:定义列表用dl标签创建，使用dd对内容进行解释说明注意：列表之间是可以互相嵌套的 ol ul dl li 都是块元素通过type属性更改列表的项目符号有序列表项目符号：1（默认值）、a、A、i、I 无序列表项目
复制链接

扫一扫