<a> 标签及其属性的使用

定义:

<a> 标签定义超链接,用于从一个页面链接到另一个页面。

<a> 元素最重要的属性是 href 属性,它指定链接的目标。

特点:

在所有浏览器中,链接的默认外观如下:

未被访问的链接带有下划线而且是蓝色的

已被访问的链接带有下划线而且是紫色的

活动链接带有下划线而且是红色的

(css去除下划线可以使用text-decoration:none,

改变a标签里的文字颜色可以设置color:black。)

  a {

            text-decoration: none;

            color: black;

        }

(1)herf属性

用于指定超链接目标的 URL。

如果 href 属性没有被指定链接,<a> 标签将不是一个链接。

注意:如果没有使用 href 属性,则不能使用 hreflang、media、rel、target 以及 type 属性。

提示:通常在当前浏览器窗口中显示被链接页面,除非规定了其他 target。

2target属性:

规定在何处打开目标 URL。仅在 href 属性存在时使用。

元素最重要的属性是 href 属性,它指示链接的目标。

a标签的跳转方式有五种: 写法为

_blank表示跳到新页面打开,打开一个新窗口

_self表示当前页面打开链接

_parent表示在父集框架中打开

_top表示在整个窗口中打开

framename表示在指定的框架中打开

(3)下载图片

download 属性定义了下载链接的地址。

href 属性必须在 <a> 标签中指定。

属性同样可以指定下载文件的名称。文件名称没有限定值,浏览器会自动在文件名称末尾添加该下载文件的后缀 (.img, .pdf, .txt, .html, 等)。

<a class="example1" href="images/flower.png" download="images/flower.png">

        <img src="images/flower.png" alt="flower">

    </a>

4锚点:

设置herf=#id名称,将跳转至id名称那个段落

<style>

        a {

            text-decoration: none;

            color: black;

        }

    </style>

</head>

<body>

    <a class="example1" href="images/flower.png" download="images/flower.png">

        <img src="images/flower.png" alt="flower">

    </a>

    <a href="#flower">跳到最后一段文字</a>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p>送你一朵小红花</p>

    <p id="flower">送你一朵小红花</p>

猜你喜欢

转载自blog.csdn.net/Min_137/article/details/126927079