Gemeinschaft Lernen Tools-Bibliothek Freizeit
suchen
Deutsch
Heim > Web-Frontend > HTML-Tutorial > 如何给超链接设置宽度和高度_html/css_WEB-ITnose

如何给超链接设置宽度和高度_html/css_WEB-ITnose

WBOY
Freigeben： 2016-06-24 11:57:23
Original
1700 Leute haben es durchsucht

1、利用display：block属性

   1: <!DOCTYPE html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   2: <html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   3: <head>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   4: <meta charset="utf-8" />
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   5: <title>a设置宽度和高度</title>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   6: <style>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   7: .abc a{
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   8:     display:block;
Nach dem Login kopieren
   9:     width:130px;
Nach dem Login kopieren
  10:     height:30px;
Nach dem Login kopieren
  11:     border:1px solid #000
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  12: }
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  13: </style>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  14: </head>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  15: <body>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  16:     <div class="abc">
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  17:         <a href="#">宽度130，高30</a>
Nach dem Login kopieren
  18:     </div>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  19: </body>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  20: </html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

效果：

2、float：left属性

   1: <!DOCTYPE html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   2: <html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   3: <head>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   4: <meta charset="utf-8" />
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   5: <title>a设置宽度和高度</title>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   6: <style>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   7: .abc a{
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   8:     float:left;
Nach dem Login kopieren
   9:     width:150px;
Nach dem Login kopieren
Nach dem Login kopieren
  10:     height:50px;
Nach dem Login kopieren
Nach dem Login kopieren
  11:     border:1px solid #000
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  12: }
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  13: </style>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  14: </head>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  15: <body>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  16:     <div class="abc">
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  17:         <a href="#">宽度150，高50</a>
Nach dem Login kopieren
Nach dem Login kopieren
  18:     </div>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  19: </body>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  20: </html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

效果：

3、对a设置padding

   1: <!DOCTYPE html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   2: <html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   3: <head>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   4: <meta charset="utf-8" />
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   5: <title>a设置宽度和高度</title>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   6: <style>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   7: .abc a{
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
   8:     padding:10px 20px;
Nach dem Login kopieren
   9:     width:150px;
Nach dem Login kopieren
Nach dem Login kopieren
  10:     height:50px;
Nach dem Login kopieren
Nach dem Login kopieren
  11:     border:1px solid #000
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  12: }
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  13: </style>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  14: </head>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  15: <body>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  16:     <div class="abc">
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  17:         <a href="#">宽度150，高50</a>
Nach dem Login kopieren
Nach dem Login kopieren
  18:     </div>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  19: </body>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren
  20: </html>
Nach dem Login kopieren
Nach dem Login kopieren
Nach dem Login kopieren

效果：


来源：http://www.ido321.com/741.html

Verwandte Etiketten：
宽度 设置 超链接 高度
Quelle：php.cn
Vorheriger Artikel：Codeforces Round #268 (Div. 2)_html/css_WEB-ITnose Nächster Artikel：新鲜出炉！9个超高分辨率的iPhone 6原型素材打包下载_html/css_WEB-ITnose
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Aktuelle Ausgaben
Verschieben Sie den Inhalt nach links, indem Sie die Eigenschaft „Width' hinzufügen Ich habe dem Körper Ränder gegeben. main {linker Rand: 200px; rechter Rand: 200px; Textaus...
Aus 2024-04-06 22:01:35
0
3
816
Berechnen Sie die Summe der Felder in einer anderen Tabelle mithilfe einer MySQL-SQL-Abfrage Ich habe ein Schema wie dieses: Benutzertabelle mit den Attributen „user_id“ und „username...
Aus 2024-04-06 19:39:29
0
1
441
Probleme beim Abrufen spezifischer Statistiken (Stats) von PokeAPI mit Axios und Node.js Ich habe ein Problem, ich versuche, die PokemonAPI zu verwenden, aber wenn ich versuche, a...
Aus 2024-04-06 18:46:35
0
1
464
Ungültiges untergeordnetes React-Element (gefunden: Objekt mit Schlüssel {clientVersion}). Wenn Sie eine Sammlung untergeordneter Elemente rendern möchten, verwenden Sie stattdessen ein Array Ich habe ein mehrstufiges Formular und wenn ich versuche, es abzusenden, wird dieser Fehle...
Aus 2024-04-06 16:25:39
0
1
346
Vergleichen Sie Imagick, Adobe Photoshop und Windows – Auflösung erkennen (Pixel pro Zentimeter oder Pixel pro Zoll) Dies ist keine Frage, sondern ein Versuch, mein Verständnis darüber zu verbessern, wie DPI...
Aus 2024-04-06 16:01:27
0
1
397
verwandte Themen
Mehr>
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage