Ir divas metodes, kā centrēt saiti:
- Centrēt saites CSS, izmantojot “ teksta līdzināšana ” īpašums
- Centrēt saites CSS, izmantojot “ starpība ” īpašums
Šajā rakstā mēs izskaidrosim abas metodes, kā centrēt saiti. Tātad, sākam!
1. metode: centrējiet saites CSS, izmantojot teksta līdzināšanas rekvizītu
Lai centrētu saites HTML valodā, mēs izmantosim ' teksta līdzināšana CSS īpašums. ' teksta līdzināšana Rekvizīts CSS tiek izmantots, lai pielāgotu teksta līdzinājumu, piemēram, pa kreisi, pa labi, centrā un attaisnotu līdzinājumu.
Sintakse
Teksta līdzināšanas rekvizīta sintakse ir:
teksta līdzināšana : vērtību
Vietā ' vērtību ”, varat iestatīt teksta līdzinājumu, piemēram, pa kreisi, pa labi, centrā un taisnot.
Tagad mēs izmantosim ' teksta līdzināšana ”, lai līdzinātu norādītās saites centrā.
Piemērs
Lai centrētu saiti tīmekļa lapā, mēs pievienosim saiti HTML tagā
. Lai to izdarītu, izmantojiet tagu , lai definētu hipersaiti un norādītu vajadzīgās vietnes adresi. Pēc tam norādiet saites nosaukumu. Mūsu gadījumā mēs esam pievienojuši saiti uz mūsu Linuxhint vietni.HTML
< ķermenis >< a href = “https://linuxhint.com/” > Linux < / a >
< / ķermenis >
Tālāk sniegtais attēls norāda, ka ir pievienota saite, kas pēc noklusējuma atrodas kreisajā pusē:
Tagad pārejiet uz CSS, lai centrētu saiti.
Šeit mēs izmantosim ' a ”, lai piekļūtu pievienotajai saitei. Pēc tam iestatiet teksta līdzināšanas vērtību kā ' centrs ' un parādīt kā ' bloķēt ”. Rezultātā elements tiks pievienots kā bloka elements, sākot ar jaunu līniju un aizņemot visu platumu.
CSS
a {teksta līdzināšana : centrs ;
displejs : bloķēt ;
}
Piezīme: CSS teksta līdzināšanas rekvizīts nedarbojas viens pats, lai centrētu tagu. Tāpēc jums ir jāizmanto ' displejs 'īpašums un iestatiet tā vērtību' bloķēt ”, lai centrētu saiti.
Tagad pārejiet uz HTML un izpildiet to, lai redzētu šādu rezultātu. Šeit jūs varat redzēt, ka saite ir izlīdzināta tīmekļa lapas centrā:
Pāriesim pie otrās metodes, lai izlīdzinātu saiti centrā.
2. metode: centrējiet saites CSS, izmantojot rekvizītu “margin”.
CSS sistēmā “ starpība Īpašums tiek izmantots saites centrēšanai. Tas ir stenogrammas ' piemale-kreisais ”, “ mala-labais ”, “ margin-top ', un ' piemale-apakšā ” īpašības. Visu doto rekvizītu vērtības var iestatīt vienā rindā.
Sintakse
Margas rekvizīta sintakse ir:
starpība : auto | tops pa labi apakšā pa kreisiIepriekš sniegtās sintakses apraksts ir sniegts zemāk:
- auto: To izmanto, lai iestatītu elementus atbilstoši pārlūkprogrammai.
- tops: To izmanto, lai iestatītu malu no augšas.
- pa labi: To izmanto, lai iestatītu malu no labās puses.
- poga: To izmanto, lai iestatītu malu no apakšas.
- pa kreisi: To izmanto, lai iestatītu piemali no kreisās puses.
Piezīme: Norādot divas vērtības, tiks apzīmēta piemale no augšas un apakšas un piemale no kreisās un labās puses; tomēr, ja tiek pievienota viena vērtība, rezerve tiks piemērota visām četrām pusēm.
Pāriesim pie piemēra, kur mēs centrēsim saiti, izmantojot ' starpība ” īpašums.
Piemērs
Vispirms iestatiet displeja rekvizīta vērtību kā ' bloķēt ' un platums kā ' 70 pikseļi ”. Pēc tam izmantojiet maržas rekvizītu un iestatiet tā vērtību uz “ auto ”:
a {displejs : bloķēt ;
platums : 70 pikseļi ;
starpība : auto ;
}
Piezīme: ' displejs ' un ' platums ” nepieciešams iestatīt īpašumu; pretējā gadījumā ' starpība ” īpašums nedarbosies. Rekvizīta platums vērtību var iestatīt atbilstoši displeja ekrāna izšķirtspējai un teksta garumam.
No dotā attēla var redzēt, ka saite ir veiksmīgi centrēta:
Tieši tā! Mēs izskaidrojām saites centrēšanas metodes.
Secinājums
' teksta līdzināšana ' un ' starpība Īpašums tiek izmantots, lai centrētu saiti ar ieguldījumu displejs ' un ' platums ” īpašums. Parādīšanas rekvizīts ir nepieciešams kopā ar teksta līdzināšanas rekvizītu, savukārt, izmantojot piemales rekvizītu, gan displeja, gan platuma rekvizīti ir obligāti, lai centrētu saiti. Šajā rokasgrāmatā ir apskatītas dažādas metodes, kā centrēt saiti CSS.