HTML基础5--强调及超链接

作者: 伊洛的小屋 | 来源:发表于2020-09-07 11:41 被阅读0次
重点强调

HTML 也提供了相应的标签,用于标记某些文本,使其具有加粗、倾斜、下划线等效果

  • 强调
    斜体字体,用<em>(emphasis)元素来标记这样的情况
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TITLE</title>
</head>
<body>
<p> 公众号:<em>伊洛的小屋</em> 作者:<em>伊洛Yiluo</em>.</p>
</body>
</html>
  • 非常重要
    在HTML中我们用<strong>表示文本十分重要,一般用粗体显示。") (strong importance) 元素来标记
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TITLE</title>
</head>
<body>
<p> 公众号:<strong>伊洛的小屋</strong> 作者:<strong>伊洛Yiluo</strong>.</p>
</body>
</html>
  • 斜体字、粗体字、下划线...
    <i> 被用来传达传统上用斜体表达的意义
    <b>用于吸引读者的注意到该元素的内容上(如果没有另加特别强调)
    <u>被用来传达传统上用下划线表达的意义:专有名词,拼写错误……
超链接

超链接使我们能够将我们的文档链接到任何其他文档,URL可以指向HTML文件、文本文件、图像、文本文档、视频和音频文件以及可以在网络上保存的任何其他内容

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TITLE</title>
</head>
<body>
<p>微信搜索:伊洛的小屋
<a href="https://yiluotalk.com">伊洛Yiluo个人网页</a>.
</p>
</body>
</html>
添加支持信息
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TITLE</title>
</head>
<body>
<p>微信搜索:伊洛的小屋
<a href="https://yiluotalk.com" title="跳转到伊洛Yiluo个人网页">
    伊洛Yiluo个人网页
</a>
</p>
</body>
</html>

链接的标题仅当鼠标悬停在其上时才会显示

文档片段

超链接除了可以链接到文档外,也可以链接到HTML文档的特定部分,首先给要链接到的元素分配一个[id]属性。
在URL的结尾使用一个井号指向它

<p>Test <a href="contacts.html#Mailing_address">mailing address</a>.</p>

下载链接时使用 download 属性

使用 download 属性来提供一个默认的保存文件名

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TITLE</title>
</head>
<body>
<a href="https://yiluotalk.com/download/"
   download="yiluo.pdf">
  Download PDF
</a>
</body>
</html>
电子邮件链接

当点击一个链接或按钮时,打开一个新的电子邮件发送信息而不是连接到一个资源或页面
使用<a>元素和mailto:URL的方案

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TITLE</title>
</head>
<body>
<a href="mailto:yiluo@demo.org">发送邮箱演示(这是个非真实邮箱)</a>
</body>
</html>

欢迎下方【戳一下】【点赞】
Author:伊洛Yiluo
愿你享受每一天,Just Enjoy !

相关文章

网友评论

    本文标题:HTML基础5--强调及超链接

    本文链接:https://www.haomeiwen.com/subject/pmxpsktx.html