基本标签

最新推荐文章于 2022-06-08 18:14:05 发布

guokanglun

最新推荐文章于 2022-06-08 18:14:05 发布

阅读量221

点赞数

分类专栏： DIV + CSS

本文链接：https://blog.csdn.net/gklcsdn/article/details/103395422

版权

DIV + CSS 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

文章目录

1. 认识标签

标记特定的文字，图片，视频，音频在浏览器上的呈现

2. 标签的基本格式

单标签： <!DOCTYPE html>
双标签：<h1> </h1>

3. 标签介绍

注释标签 
html 标签 <html> </html>
网页上的所有内容，无论是给用户看的还是用来与浏览器或搜索引擎通讯的信息，统一存放在HTML的开始标签与结束标签之间
head标签 <head> </head>
存储所有给浏览器或搜索引擎看的信息
例如： <title>Document</title>
title 标签 <title></title>
存放网页的名字
meta标签 <meta>
meta 标签被称为元数据，告诉浏览器或搜索引擎关于网页的一些基本数据
body 标签 <body></body>
存放用户能看到的所有内容，包括文字，图片，视频，音频等

4. 常用标签

4.1 布局标签

划分网页的布局展示位置宽高

div 标签 <div></div>
在网页内容中划分一个矩形区域用来存放内容
div标签可以嵌套任意标签
ul 标签：无序列表标签
网页中一些内容相似，结构相仿，布局接近的区域使用无序列表进行区分

list-style: none
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>

ol 标签：有序列表标签
和无序列表标签类似，有先后顺序
ul ol 内嵌的只能是li标签，li 标签里可以嵌套所有标签

    <ol>
        <li></li>
        <li></li>
        <li></li>
    </ol>

自定义列表（dl dt dd）
dt 标题
dd 描述信息
内容不完全一致，结构相似，布局相似

4.2 文本标签

h 标签：标题标签
权重：h1 > h2 > h3 > h4 > h5 > h6
h1 标签只能出现一次
等级次序：
标题嵌套规则，数字由小到大
p 标签：文本标签，用于存放大段文本内容的标签
blockquote标签：引用标签，在网页中划分引用古典，古籍或名人名言的区域
span 标签：在大段文字中间的一小段文字，给以特殊标记，例如颜色，下划线等
strong 标签：重要文本标记
em 标签：强调效果若于strong，斜体标签
10.i 标签：没有强调作用，只是字体样式倾斜
a标签：跳转标签
文本，图片，某一区域都可以作为超链接跳转

<a href="http://www.baidu.com" target="_blank">baidu</a>

href：跳转地址
target： _blank 新页面打开，默认当前页面打开
9. img 标签：图片标签

<img src="./5千米的山顶风景桌面壁纸.jpg" alt="" style='width: 300px; height: 200px;' title='风景'>

src：图片路径
alt：图片描述
style：图片样式大小（样式尺寸）
title：标题

<img src="https://img-blog.csdnimg.cn/20191117165843428.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2drbGNzZG4=,size_16,color_FFFFFF,t_70" alt="" width="200px" height="200px">

width height 图片实际尺寸（一般不这么写）
在这里插入图片描述
10. video 标签：视频标签

<video src="wuhan.mp4" controls='controls' style="width: 300px; height: 200px;"></video>

src：视频路径
controls：视频控制按钮
style：样式大小
在这里插入图片描述
11. audio 标签：音频标签

<audio src="千禧.mp3" controls='controls' autoplay='autoplay' loop='loop'></audio>

src: 音频路径
controls: 音频文件控制按钮区域
autoplay: 自动播放
loop: 无限循环播放
在这里插入图片描述

guokanglun

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
基本标签

1. 什么是标签标签是由小于号 + 中间字符 + 大于号组成的代码例如： <!DOCTYPE html>作用：给用户展示特定内容或是告诉浏览器与搜索引擎关于网页的部分信息2. 标签的基本格式单标签： <!DOCTYPE html>双标签：<h1> </h1>3. 标签介绍注释标签 html 标签 ...
复制链接

扫一扫

专栏目录