HTML、CSS学习③

TheBestHL

已于 2022-10-20 23:40:48 修改

阅读量62

点赞数

文章标签： css 学习 html5

于 2022-10-20 23:37:52 首次发布

本文链接：https://blog.csdn.net/TheBestHL/article/details/127436617

版权

本文详细介绍了HTML中的跳转链接、锚点定位、特殊字符处理，以及无序列表（ul-li）、有序列表（ol-li）和定义列表(dl-dd)的使用方法。通过实例展示，掌握如何创建指向特定位置的链接，以及如何优雅地组织列表内容。

摘要由CSDN通过智能技术生成

跳转链接

<a>标签 →双标签 <a></a>
href属性：链接的地址。
target属性：可以改变链接打开的方式，默认情况下，在当前页面打卡 _self
新窗口打开 _blank

跳转链接可跟图片绑定
示例：
在这里插入图片描述

需要注意的是目前点击链接会使原网页替换成新网页。
想要使链接跳转后原网页不关闭就需要用到`中的_blank

例如：
在这里插入图片描述
`

这个时候跳转链接就不会将原网址关闭了。

<base>标签 → 单标签 ：作用就是改变链接的默认行为。
<base>一般写道<head></head>当中

示例：

在这里插入图片描述

如图可见，在<body>中并没有填写<target="_blank"> 但是链接打开依旧是打开了新窗口。

实现一
#号
id属性
示例：
在这里插入图片描述

如图，点击对应的锚点就会跳转到对应的地方。

实现二
#号
name属性
示例：
在这里插入图片描述

当2跳转时，会跳转到<a name="第二章"></a>处，但因为该处name不显任何值，仅做映射，所以效果也为直接跳转。

编写一些文本时，经常会遇到输入法无法输入的字符。这些无法输入和空格字符都是特殊字符，在HTML中，为这些二特殊字符准备了专门的代码。

在这里插入图片描述

<ul>、<li>：列表的最外层容器、列表项
注：ui和li必须是组合出现的，他们之间时不能有其他标签的。

在这里插入图片描述
type属性：改变前面标记的样式（一般都是用CSS去控制）

<ol>、<li>：列表的最外层容器、列表项
注：有序列表用的非常少，经常用的时无需列表，无序列表可以去替代有序列表。
有序列表也提供了type属性（一般使用CSS控制）

在这里插入图片描述

<dl>：定义列表
<dt>：定义专业术语或名词
<dd>：对名词进行解释和描述
列表项需要添加标题和对标题进行描述的内容

示例：
在这里插入图片描述

关注