Ada dua metode untuk memusatkan tautan:
- Tautan tengah dalam CSS menggunakan ' perataan teks ' Properti
- Tautan tengah dalam CSS menggunakan ' batas ' Properti
Pada artikel ini, kami akan menjelaskan kedua metode untuk memusatkan tautan. Jadi ayo mulai!
Metode 1: Tautan Pusat di CSS Menggunakan Properti perataan teks
Untuk memusatkan tautan dalam HTML, kami akan menggunakan ' perataan teks ” milik CSS. ' perataan teks Properti ” pada CSS digunakan untuk mengatur perataan teks seperti perataan kiri, kanan, tengah, dan justify.
Sintaksis
Sintaks dari properti text-align adalah:
perataan teks : nilai
Di tempat “ nilai ”, Anda dapat mengatur perataan teks seperti kiri, kanan, tengah, dan justify.
Sekarang, kita akan menggunakan ' perataan teks ” untuk meratakan tengah tautan yang diberikan.
Contoh
Untuk memusatkan tautan pada halaman web, kami akan menambahkan tautan dalam HTML di dalam tag
. Untuk melakukannya, gunakan tag untuk menentukan hyperlink dan berikan alamat situs yang diperlukan. Setelah itu, tentukan nama tautannya. Dalam kasus kami, kami telah menambahkan tautan ke situs web Linuxhint kami.HTML
< tubuh >< sebuah href = “https://linuxhint.com/” > Linux < / sebuah >
< / tubuh >
Gambar yang disediakan di bawah ini menunjukkan bahwa tautan ditambahkan yang diposisikan di sisi kiri secara default:
Sekarang pindah ke CSS untuk memusatkan tautan.
Di sini, kita akan menggunakan “ sebuah ” untuk mengakses tautan yang ditambahkan. Setelah itu, atur nilai text-align sebagai “ tengah ” dan tampilkan sebagai “ memblokir ”. Akibatnya, elemen akan ditambahkan sebagai elemen blok, mulai dari baris baru dan mengambil seluruh lebar.
CSS
sebuah {perataan teks : tengah ;
menampilkan : memblokir ;
}
Catatan: Properti perataan teks CSS tidak bekerja sendiri untuk memusatkan tag. Oleh karena itu, Anda harus menggunakan ' menampilkan ” properti dan tetapkan nilainya “ memblokir ” untuk memusatkan tautan.
Sekarang, pindah ke HTML dan jalankan untuk melihat hasil berikut. Di sini, Anda dapat melihat bahwa tautan disejajarkan di tengah halaman web:
Mari beralih ke metode kedua untuk menyelaraskan tautan di tengah.
Metode 2: Tautan Pusat di CSS Menggunakan Properti 'margin'
Di CSS, ' batas Properti ” digunakan untuk memusatkan tautan. Ini adalah properti singkatan dari “ margin-kiri ”, “ margin-kanan ”, “ margin-atas ', dan ' margin-bawah ” properti. Anda dapat mengatur nilai semua properti yang diberikan dalam satu baris.
Sintaksis
Sintaks properti margin adalah:
batas : mobil | atas Baik bawah kiriDeskripsi sintaks yang disediakan di atas diberikan di bawah ini:
- mobil: Ini digunakan untuk mengatur elemen sesuai dengan browser.
- atas: Digunakan untuk mengatur margin dari atas.
- Baik: Digunakan untuk mengatur margin dari kanan.
- tombol: Digunakan untuk mengatur margin dari bawah.
- kiri: Digunakan untuk mengatur margin dari kiri.
Catatan: Menentukan dua nilai akan menandakan margin dari atas dan bawah dan margin dari kiri dan kanan; namun, jika satu nilai ditambahkan, margin akan diterapkan ke keempat sisi.
Mari kita beralih ke contoh, di mana kita akan memusatkan tautan menggunakan ' batas ' Properti.
Contoh
Pertama-tama tetapkan nilai properti tampilan sebagai “ memblokir ” dan lebarnya sebagai “ 70px ”. Setelah itu, terapkan properti margin dan atur nilainya menjadi “ mobil ”:
sebuah {menampilkan : memblokir ;
lebar : 70px ;
batas : mobil ;
}
Catatan: ' menampilkan ' dan ' lebar ” properti diperlukan untuk mengatur; jika tidak, ' batas ” properti tidak akan berfungsi. Nilai properti lebar dapat diatur sesuai dengan resolusi tampilan layar dan panjang teks.
Anda dapat melihat dari gambar yang diberikan bahwa tautan berhasil dipusatkan:
Itu dia! Kami menjelaskan metode untuk memusatkan tautan.
Kesimpulan
' perataan teks ' dan ' batas ” properti digunakan untuk memusatkan tautan dengan kontribusi dari “ menampilkan ' dan ' lebar ' Properti. Properti tampilan diperlukan bersama dengan properti perataan teks, saat menggunakan properti margin, properti tampilan dan lebar wajib untuk memusatkan tautan. Panduan ini telah membahas berbagai metode untuk memusatkan tautan di CSS.