Ta priročnik vas bo naučil postopka ustvarjanja prostora med dvema povezavama.
Začnimo!
Kako dati prostor med dvema povezavama v HTML in CSS?
Če želite ustvariti prostor med dvema povezavama, najprej dodajte zahtevane povezave v datoteko HTML.
1. korak: Dodajte povezave v HTML
V HTML-ju bomo ustvarili vsebnik z oznako
HTML
< div >< a href = “https://linuxhint.com/create-html-file/” > Kako ustvariti datoteko HTML? < / a >
< a href = “https://linuxhint.com/edit-html-file/” > Kako urediti datoteko HTML? < / a >
< / div >
Naslednja slika prikazuje, da so bile povezave uspešno dodane:
2. korak: Oblikujte Div & Link
V tem koraku oblikujte element div in povezavo z ' div « v CSS. Oblazinjenje bomo prilagodili na ' 40 slikovnih pik « in nastavite velikost pisave povezav kot » večji «, višina diva je nastavljena kot » 150 slikovnih pik « in uporabite lastnost ozadja ter nastavite barvo diva kot » Črna ”. Nato prilagodite širino obrobe kot ' 5px ', slog kot ' črtkano « in barva kot » rgb(251, 255, 0) ”.
CSS
div {oblazinjenje : 40 slikovnih pik ;
velikost pisave : večji ;
višina : 150 slikovnih pik ;
ozadje : Črna ;
meja : 5px črtkano rgb ( 251 , 255 , 0 ) ;
}
Z uporabo zgornje kode dobimo naslednji rezultat. Kot lahko vidite, sta div in povezave oblikovana:
3. korak: Vodoravno postavite prostor med dvema povezavama
Z uporabo HTML in CSS lahko damo prostor med dvema povezavama vodoravno. Tu bomo eno za drugo razložili obe metodi.
1. način: Uporaba HTML-ja
Če želite omogočiti prostor med povezavami, ne da bi pisali zunanji CSS, lahko uporabite » « v HTML, kjer želite ustvariti prostor. “ ” pomeni neprekinjen prostor. V datoteki HTML dodajanje enega pomeni en presledek. Če želite dati več prostora, ni priporočljivo, da ročno dodate glede na zahtevano število presledkov.
Pojdimo na primer, da razumemo navedeni koncept!
Primer
Tukaj bomo napisali štirikrat ' ”, da ustvarite prostor za prvo povezavo tako, da se bo druga povezava pojavila za štirimi presledki.
HTML
< div >< a href = “https://linuxhint.com/create-html-file/” > Kako ustvariti datoteko HTML? < / a >
Kako urediti datoteko HTML?
Kot lahko vidite, je prostor ustvarjen na desni strani prve povezave:
2. način: Uporaba CSS
V CSS bomo uporabili » margin-desno ” lastnost za presledek med dvema povezavama. ' margin-desno Lastnost se uporablja za dodajanje prostora z desne strani elementa. Zanj lahko določite tudi negativne vrednosti.
Sintaksa
Sintaksa lastnosti margin-right je podana spodaj:
margin-desno : vrednostNa mestu ' vrednost «, nastavite rob z desne strani elementa. Nadaljujmo primer.
Primer
Tukaj bomo uporabili ' a ” za dostop do povezave, ki smo jo ustvarili v HTML-ju. Nato nastavite vrednost lastnosti margin-right kot ' 50 slikovnih pik ”:
a {margin-desno : 50 slikovnih pik ;
}
Prostor je ustvarjen z desne strani prve povezave, ki jo lahko vidite spodaj:
4. korak: Navpično postavite prostor med dvema povezavama
Če želite zagotoviti navpični razmik med dvema povezavama, najprej poravnajte povezave v navpični obliki. To bo storjeno z uporabo » blok ' vrednost ' zaslon ' in nato z uporabo ' višina vrstice ” za presledek med dvema povezovalnima linijama.
primer:
Tukaj bomo nastavili vrednost lastnosti prikaza kot ' blok ” za navpično poravnavo povezav. Nato navedite presledek med dvema povezavama tako, da nastavite vrednost lastnosti line-height kot ' 80 slikovnih pik ”:
a {zaslon : blok ;
višina vrstice : 80 slikovnih pik ;
}
Kot lahko vidite, je prostor ustvarjen z lastnostjo line-height:
To je to! Razložili smo način dajanja prostora med dvema povezavama v HTML in CSS.
Zaključek
' ”, “ margin-desno «, in » višina vrstice ” Lastnosti CSS se uporabljajo za vodoravni in navpični razmik med dvema povezavama. S tem lahko prilagodite prostor z desne in leve strani povezav. V tem članku smo razložili postopek za dodelitev prostora med dvema povezavama z uporabo dveh različnih metod in podali povezane primere.