HTML示例02---插入超链接以及超链接颜色设置

浅浅的花香味﹌ 2022-03-19 10:56 510阅读 0赞

这里主要讲了下超链接在不同时刻时候的颜色设置，包括：未访问的链接、已访问的链接、鼠标移动到链接上时的颜色设置

代码如下：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="utf-8">
  5.     <title>简单的HTML文件</title>
  6.     <style type="text/css">
  7.         a:link {color: #00FF00} /* 未访问的链接 */
  8.         a:visited {color: #FF0000} /* 已访问的链接 */
  9.         a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
  10.         a:active {color: #0000FF} /* 选定的链接 */
  11.     </style>
  12. </head>
  13. <body style="background-repeat:no-repeat;
  14.              background-size:cover;
  15.              background-color: #47C4ED;
  16.              color: rebeccapurple;"
  17.       topmargin="100px" leftmargin="50px">
  18. <h1 align="center">HTML5初露端倪</h1>
  19. <hr>
  20. <p>让我们一起体验超炫的HTML5的旅程吧</p>
  21. <span style="font-size: 20px; color: red;">This is some text!</span>
  22. <br>
  23. <a href="https://www.163.com/">访问网易官网</a>
  24. </body>
  25. </html>

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NpbmF0XzMzNzE4NTYz_size_16_color_FFFFFF_t_70

观察结果：

（1）访问超链接之前的颜色为浅绿色

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NpbmF0XzMzNzE4NTYz_size_16_color_FFFFFF_t_70 1

（2）访问超链接之后的颜色为红色

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NpbmF0XzMzNzE4NTYz_size_16_color_FFFFFF_t_70 2

（3）鼠标悬浮在链接上的颜色为紫红色

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NpbmF0XzMzNzE4NTYz_size_16_color_FFFFFF_t_70 3

发表评论

表情：
评论列表 （有 0 条评论，510人围观）

还没有评论，来说两句吧...

相关阅读

    相关 HTML-03-超链接

    链接格式 <a href="跳转目标" target="新窗口打开方式"> 文本或者图片</a> href用于指定链接目标的url地址，当标签应用href

    灰太狼灰太狼/ 0 赞/ 362 阅读

    相关 HTML——超链接

             一、What？——什么是超链接     先说一下我个人目前对“超链接”的理解，就两字：跳转     哈哈，我个人的理解好像解释的有点简单粗暴了，比原词还

    青旅半醒青旅半醒/ 0 赞/ 439 阅读

    相关 HTML：建立超链接

    第三章：建立超链接 超级链接是HTML文档中的最基本特征之一，他能够让浏览者在各个独立的页面之间方便的跳转。每个网站都是由众多的网页组成，网页之间通常通过链接方式相互关联

    Love The Way You LieLove The Way You Lie/ 0 赞/ 456 阅读

    相关 HTML之超链接

    HTML文本之所以被称为超文本，就是因为它具有普通文本所不具有的超链接功能。我们在浏览HTML文档时，可以通过点击关键字（一个超链接），来跳转页面。 要让超链接能够正常工作，

    分手后的思念是犯贱分手后的思念是犯贱/ 0 赞/ 377 阅读

    相关 HTML图片超链接怎么设置

    一个<a>标签中加上一个<img>标签内容，即可让该<img>拥有一个超链接。然后可以在后面继续写文字，此文字就会显示成超链接，点击该文字即可进入超链接。 首先小编在这...

    你的名字你的名字/ 0 赞/ 1013 阅读