Garis bawahi teks dalam HTML

Pengarang: John Pratt
Tanggal Pembuatan: 17 Februari 2021
Tanggal Pembaruan: 1 Juli 2024
Anonim
Tutorial HTML Part 8 - Membuat Garis Bawah dan Coretan di HTML
Video: Tutorial HTML Part 8 - Membuat Garis Bawah dan Coretan di HTML

Isi

Menggarisbawahi dalam HTML dulu adalah masalah mengapit teks di antara tag u> / u>, tetapi metode ini tidak lagi digunakan untuk mendukung CSS yang lebih serbaguna. Menggarisbawahi di halaman web umumnya dianggap sebagai cara yang tidak nyaman untuk menekankan bagian teks tertentu. Ini karena teks yang digarisbawahi mudah tertukar dengan tautan.

Melangkah

Metode 1 dari 2: Metode saat ini

  1. Gunakan properti dekorasi teks dalam gaya CSS Anda. Penggunaan tag u> bukan lagi cara yang sesuai untuk menggarisbawahi teks. Sebagai gantinya, kami menggunakan properti CSS "text-decoration".
    • Ini membuat kode lebih mudah dimodifikasi, sehingga Anda tidak perlu mengubah apa pun tentang kode lama jika sudah tidak dapat digunakan.
  2. Gunakan tag span> jika Anda ingin menggarisbawahi bagian teks tertentu. Tempatkan tag awal bersama dengan properti "dekorasi-teks" di tempat Anda ingin garis bawah dimulai. Tempatkan tag akhir / span> di tempat garis bawah harus berhenti.

    span style = "text-decoration: underline;"> Ini akan digarisbawahi./span>

  3. Deklarasikan elemen HTML dalam gaya> bagian dari halaman Anda. Anda juga dapat melakukan ini di lembar gaya CSS. Menggarisbawahi dapat dibuat lebih mudah dengan mengaitkan gaya dengan elemen HTML. Misalnya, untuk menggarisbawahi semua header level 3 Anda, tambahkan gaya CSS berikut:

    html> head> style> h3 {text-decoration: underline; } / style> / head> body> h3> Judul ini digarisbawahi / h3> / body> / html>

  4. Buat kelas CSS untuk digarisbawahi dengan cepat kapan saja. Anda dapat membuat kelas dalam style sheet atau style>, untuk dipanggil nanti. Kelas dapat memiliki nama apa pun yang Anda inginkan.

    html> head> style> .underline {text-decoration: underline; } / style> / head> body> Anda dapat menggunakan kelas ini untuk dengan cepat menggarisbawahi div> / div> dari berbagai bagian div> dari konten / div> / body> / html>

  5. Pertimbangkan metode lain untuk menekankan teks. Menggarisbawahi harus dihindari untuk menghindari kebingungan bagi pembaca. Metode yang populer adalah menggunakan tag em>, yang membuat teks menjadi miring. Anda dapat menggunakan CSS untuk menentukan tag ini lebih lanjut, untuk cara penekanan yang unik.

    html> head> style> em {color: red; } / style> / head> body> Semua yang ada di dalam elemen em akan menjadi em> italic (karena pengaturan default), dan merah / em> karena style yang ditambahkan di atas. / body> / html>

Metode 2 dari 2: Metode usang

  1. Hindari menggunakan tag u> / u> yang lama. Ini "tidak disarankan", artinya masih berfungsi, tetapi tidak lagi digunakan atau direkomendasikan. Ini karena HTML pada prinsipnya tidak dirancang sebagai bahasa markup. Tag u> akan tetap berfungsi, tetapi sekarang dimaksudkan untuk menunjukkan teks yang berbeda dari teks lainnya, seperti kata yang salah eja atau kata benda Cina.
  2. Gunakan tag u> / u> untuk menggarisbawahi (untuk tujuan ilustrasi saja). Dalam situasi apa pun Anda tidak boleh menggunakan metode ini lagi. Mungkin baik untuk mengetahui bagaimana itu digunakan jika Anda perlu memperbarui situs web yang lebih lama.

    html> body> Dengan tag lama u> di HTML Anda dapat dengan cepat menggarisbawahi hal / u>, tetapi hal-hal dengan cepat menjadi berantakan ketika elemen gaya lain digunakan. Itulah mengapa kami sekarang menggarisbawahi "dekorasi teks" dengan elemen CSS. / body> / html>

Tips

  • Hampir selalu ada cara yang lebih baik untuk menekankan sesuatu pada halaman web daripada dengan menggarisbawahi. Ini bisa sangat membingungkan pembaca. Jadikan teks Anda lebih indah dengan CSS, untuk membuatnya menonjol secara positif.