LearningFront-end

最新推荐文章于 2024-10-28 23:09:23 发布

如库~

最新推荐文章于 2024-10-28 23:09:23 发布

阅读量1.4k

点赞数 38

文章标签： css 前端

本文链接：https://blog.csdn.net/weixin_51488007/article/details/139121378

版权

Front-End

## HTML

1. HTML基本标签结构

 <!DOCTYPE html>// 文档类型的声明，告知浏览器是哪个版本的HTML 文档，需要注意的是它并不是一个HTML 标签，只是一个文档类型声名标签
 <html lang="en"> // 在html 标签中指定了语言
 <head>// 在头部标签中指定字符集，常用的有 UTF-8
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Document</title>
 </head>
 <body>
     
 </body>
 </html>

标签名	标签的含义	说明
<html> <html/>	HTML标签	页面中最大的标签，称为根标签
<head><head/>	文档的头部标签	主要在head 标签中我们必须拥有的是 TITIE 标签，用来表示当前文档的标题
<title><title/>	文档的标题	让文档拥有一个自己的标题
<body><body/>	文档的主体	元素包含了文档的所有内容，页面内容基本都是放置在

2. HTML常用的标签

2.1 标题标签

#<h1>我是一级标签</h1><h6></h6> 需要注意的是每一个标题标签中的内容都是加粗的，也就是<strong></strong> 标签的作用。

特点：

加了标题标签的文字会被加粗

独占一行

2.2 段落标签和换行标签

#<p>我是一个段落</p>

特点：

文本在段落中会根据浏览器窗口的大小自动换行

段落和段落之间保证了空格

#

特点：

在HTML 文档中，文字会不断的从左到右进行显示，直到对话框的末尾。如果像要进行提前的换行操作，那么就可以使用当前换行但标签。

// 是一个单标签

br 只是简单的开启新的一行，而段落标签会在两行文字中间插入一个垂直的间距

2.3 文本格式化标签

在网页中，常见的文字格式有加粗、斜体、下划线、删除线，对于这四种格式都有对应的标签来操作。

标签	语义	说明
<strong><strong/>	加粗	推荐使用，语义强烈
<em><em/>	斜体	推荐使用，语义强烈
<ins><ins/>	下划线	推荐使用，语义强烈
<del><del/>	删除线	推荐使用，语义强烈

2.4 div 和 span 标签

div 和 span 是没有语义，是一个“盒子”用来转载内容的。

div 这是头部

span 这是标题

div是division表示分割、分区，span表示跨度、跨区

特点：

div 标签用来布局，每一行只能放置一个。大盒子

span 标签用来布局，每行可以放置多个。小盒子

2.5 图像标签和路径

图像标签

<img src="图像的URL"

src是 img 标签的必须属性，用于指定图像文件的路径和文件名称

图像标签的属性

属性	属性值	说明
src	图片路径	必须属性
alt	文本	替换文本：如果由于某种原因无法显示图像，则指定图像的替代文本
title	文本	提示文本：鼠标放置图片上显示的文字
width	像素	设置图像的宽度
height	像素	设置图像的高度
border	像素	设置tu'xiatuxia哪个的边框粗细

2.6 超链接标签

链接的语法格式

<a href=" " target=" > 文本或者是图像 < /a>

属性	作用
href	f'sf必须属性，用来指定链接的目标地址
target	表示跳转的方式，其中self是默认的，表示在当前页面打开，blank表示在新页面打开

链接的分类

外部链接 <a href="https://baidu.com> 百度一下</a>。
内部链接：网站内部页面之间的相互链接，直接链接内部的页面名称就可以，例如首页
空连接：如果没有确定的链接目标时，首页
下载链接：如果链接中的内容是一个文件或者是压缩包，会直接下载当前文件。
网页元素链接：文本、图片表格、音频、视频，都是可以直接超链接的
锚点链接：点解链接的时候，快速定位到当前页面中的某个位置
- 在href 中的属性设置为 #名称（一般是ID）例如：第二集
- 找到目标的标签位置，在里面添加一个ID 属性，等于刚才的名称。<h3 id="two"></h3>