如何给超链接设置宽度和高度

短命女 2022-08-12 09:59 146阅读 0赞

1、利用display：block属性

1: <!DOCTYPE html>

2: <html>

3: <head>

4: <meta charset="utf-8" />

5: <title>a设置宽度和高度</title>

6: <style>

7: .abc a{

8:     display:block;

9:     width:130px;

10:     height:30px;

11:     border:1px solid #000

12: }

13: </style>

14: </head>

15: <body>

16:     <div class="abc">

17:         <a href="#">宽度130，高30</a>

18:     </div>

19: </body>

20: </html>

效果：

![SouthEast][]

2、float：left属性

1: <!DOCTYPE html>

2: <html>

3: <head>

4: <meta charset="utf-8" />

5: <title>a设置宽度和高度</title>

6: <style>

7: .abc a{

8:     float:left;

9:     width:150px;

10:     height:50px;

11:     border:1px solid #000

12: }

13: </style>

14: </head>

15: <body>

16:     <div class="abc">

17:         <a href="#">宽度150，高50</a>

18:     </div>

19: </body>

20: </html>

效果：

![SouthEast 1][]

3、对a设置padding

1: <!DOCTYPE html>

2: <html>

3: <head>

4: <meta charset="utf-8" />

5: <title>a设置宽度和高度</title>

6: <style>

7: .abc a{

8:     padding:10px 20px;

9:     width:150px;

10:     height:50px;

11:     border:1px solid #000

12: }

13: </style>

14: </head>

15: <body>

16:     <div class="abc">

17:         <a href="#">宽度150，高50</a>

18:     </div>

19: </body>

20: </html>

效果：

![SouthEast 2][]

来源：[http://www.ido321.com/741.html][http_www.ido321.com_741.html]

[SouthEast]: /images/20220810/4bd527da7c614a58be79929e33c55e3d.png
[SouthEast 1]: /images/20220810/f394dc891e8d4648af9c4364eb28df70.png
[SouthEast 2]: /images/20220810/45ce6004dde24b5f96ddcd6c7db78405.png
[http_www.ido321.com_741.html]: http://www.ido321.com/741.html

发表评论取消回复

表情：

评论列表（有 0 条评论，146人围观）

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

相关阅读

相关 C# 如何给Word文档添加超链接及设置超链接的样式

在Word文档中我们经常可以看到很多超链接，其中最常见的是文本超链接，其次是图片超链接，通过点击这些超链接，我们可以快速地从当前文档跳转到指定的网站或打开指定的外部文件，非常方

秒速五厘米/ 2023年10月17日 16:59/ 0 赞/ 71 阅读

相关超链接的内部链接和外部链接

超链接可以分为内部链接和外部链接两种。内部链接是指网站内部文件之间的链接，而外部链接是指网站内的文件链接到站点内容外的文件。代码如下： ![在这里插入图片描述][wat

妖狐艹你老母/ 2022年12月11日 13:36/ 0 赞/ 218 阅读

相关 android 设置高度等于宽度,如何设置relativelayout高度等于它的宽度？

我搜索了很多，以找出它的工作原理，我什么都没有。我发现一些Java代码动态地做到这一点，但没有工作主题的蚂蚁，当打开程序，显示一个力量关闭。这是我的代码：如何设置relat

一时失言乱红尘/ 2022年10月16日 07:28/ 0 赞/ 176 阅读

相关 html超链接图片下加文字颜色,如何为文字、形状、图片添加超链接？如何为超链接设置颜色？...

你知道如何为PPT中的文字、形状、图片添加超链接吗？那么，你又知道如何设置超链接的颜色吗？接下来小编就来仔细的讲解一下吧~看图思路更清晰哦！如何为PPT中的文字、形状、图片

青旅半醒/ 2022年10月11日 03:50/ 0 赞/ 197 阅读

相关如何给超链接设置宽度和高度

1、利用display：block属性 1: <!DOCTYPE html> 2: <html> 3: <head> 4: <meta

短命女/ 2022年08月12日 09:59/ 0 赞/ 147 阅读

相关 flex datagrid 设置超链接

下面是一个在datagrid中设置超链接的一个小例子： DataGridLink.mxml <?xml version="1.0" encoding="utf-8"?

男娘i/ 2022年08月02日 04:51/ 0 赞/ 117 阅读

相关设置背景图片的宽度和高度

使用background-size属性设置语法： background-size: length|percentage|cover|contain;

Love The Way You Lie/ 2022年06月13日 06:54/ 0 赞/ 284 阅读

相关给超链接加onclick事件

在动态网页中，常常需要在单击超链接时处理一些数据，而不是跳转一个网页。在这种情况下，通常有以下三种处理方式：不设置<a>标签的href属性，只设置onclick属性。在这种

柔情只为你懂/ 2022年06月10日 11:23/ 0 赞/ 305 阅读

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

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

浅浅的花香味﹌/ 2022年03月19日 10:56/ 0 赞/ 346 阅读

相关 html中如何设置超链接的样式

设置超链接的样式示例： a:link 超链接被点前状态 a:visited 超链接点击后状态 a:hover 悬停在超链接时

小灰灰/ 2020年05月14日 10:38/ 0 赞/ 980 阅读