前端学习1day----HTML

最新推荐文章于 2024-10-08 17:48:41 发布

多哈哈哈哈

最新推荐文章于 2024-10-08 17:48:41 发布

阅读量104

点赞数

分类专栏：笔记文章标签：前端 html 学习

本文链接：https://blog.csdn.net/qq_44980326/article/details/126578625

版权

笔记专栏收录该内容

1 篇文章 0 订阅

订阅专栏

这里写自定义目录标题

文档声明头
页面语言 lang
base标签
标题标签
HTML标签是分等级的，HTML将所有的标签分为两种：
水平线标签`<hr />`
`<div>和<span>`标签
内容居中标签 `<center>`
超链接的属性href：目标URL
相对路径和绝对路径的总结
H5中新增的语义标签

文档声明头

<!DOCTYPE html>

任何一个标准的HTML页面，第一行一定是一个以开头的语句。这一行，就是文档声明头，即 DocType
Declaration，简称DTD。

DTD可告知浏览器文档使用哪种 HTML 或 XHTML 规范。

页面语言 lang

下面这行标签，用于指定页面的语言类型：

 <html lang="en">

最常见的语言类型有两种：

en：定义页面语言为英语。

zh-CN：定义页面语言为中文。

base标签

<base href="/">

base 标签用于指定基础的路径。指定之后，所有的 a 链接都是以这个路径为基准。

标题标签

标题使用<h1>至<h6>标签进行定义。<h1>定义最大的标题，<h6>定义最小的标题。具有align属性，属性值可以是：left、center、right。

HTML标签是分等级的，HTML将所有的标签分为两种：

文本级标签：p、span、a、b、i、u、em。文本级标签里只能放文字、图片、表单元素。（a标签里不能放a和input）

容器级标签：div、h系列、li、dt、dd。容器级标签里可以放置任何东西。

水平线标签`<hr />`

属性介绍：

align=“属性值”：设定线条置放位置。属性值可选择：left right center。
size=“2”：设定线条粗细。以像素为单位，内定为2。
width=“500"或width=“70%”：设定线条长度。可以是绝对值（单位是像素）或相对值。如果设置为相对值的话，内定为100%。
color=”#0000FF"：设置线条颜色。 noshade：不要阴影，即设定线条为平面显示。若没有这个属性则表明线条具阴影或立体

`<div>和<span>`标签

div和span是非常重要的标签，div的语义是division“分割”；
span的语义就是span“范围、跨度”。想必你应该听说过“div + css”布局。

div和span的介绍 div标签：可以把标签中的内容分割为独立的区块。必须单独占据一行。

span标签：和div的作用一致，但不换行。

内容居中标签 `<center>`

此时center代表是一个标签，而不是一个属性值了。只要是在这个标签里面的内容，都会居于浏览器的中间。

超链接的属性href：目标URL

title：悬停文本。 name：主要用于设置一个锚点的名称。
target：告诉浏览器用什么方式来打开目标页面。target属性有以下几个值：
_self：在同一个网页中显示（默认值）
_blank：在新的窗口中打开。
_parent：在父窗口中显示
_top：在顶级窗口中显示

相对路径和绝对路径的总结

相对路径的好处：站点不管拷贝到哪里，文件和图片的相对路径关系都是不变的。相对路径使用有一个前提，就是网页文件和你的图片，必须在一个服务器上。

总结一下：

无论是在 a 标签还是 img 标签上，如果要用路径。只有两种路径能用，就是相对路径和绝对路径：

相对路径从自己出发，找到别人。

绝对路径，就是http://或者https://开头的路径。

H5中新增的语义标签

<section> 表示区块

<article> 表示文章。如文章、评论、帖子、博客

<header> 表示页眉

<footer> 表示页脚

<nav> 表示导航

<aside> 表示侧边栏。如文章的侧栏

<figure> 表示媒介内容分组。

<mark> 表示标记 (用得少)

<progress> 表示进度 (用得少)

<time> 表示日期

本质上新语义标签与<div>、<span>没有区别，只是其具有表意性，使用时除了在HTML结构上需要注意外，其它和普通标签的使用无任何差别，可以理解成<div class="nav"> 相当于<nav>。