Bagaimanakah saya indent atau teks tab pada laman web saya atau dalam HTML?

Terdapat kaedah pengindeksan yang berlainan. Bagaimanapun, untuk keserasian dengan banyak penyemak imbas dan kebolehaksesan, kami membincangkan kaedah yang paling popular untuk mengindeks teks pada halaman web anda.

Kaedah yang disyorkan dengan CSS & HTML

Untuk indentasi teks atau perenggan, kaedah yang paling biasa digunakan dan disyorkan adalah menggunakan CSS. Berikut adalah contoh yang berbeza bagaimana CSS boleh digunakan untuk teks inden. Setiap contoh ini akan diletakkan di antara tag HTML anda.

Contoh berikut akan mencipta kelas gaya bernama "tab" yang mengindikasikan teks dan perenggan 40 piksel dari sebelah kiri.

Setelah kod di atas berada dalam bahagian, anda boleh menggunakannya pada bila-bila masa dengan menambahkannya ke perenggan anda (

) seperti yang ditunjukkan.

Contoh tab

Termasuk CSS dalam dokumen HTML anda, seperti yang ditunjukkan di atas, disebut sebagai "dalam talian" CSS. Ia berguna untuk membuat perubahan dengan cepat, tetapi dalam jangka panjang, sukar untuk diubah kemudian.

Sebaliknya, anda boleh mengambil semua kod CSS anda dan meletakkannya fail berasingan, dengan sambungan .css. Kemudian, anda boleh memaut ke satu fail ini dari mana-mana dokumen HTML, dan dokumen itu boleh menggunakan sifat-sifat CSS tersebut. Menggunakan fail CSS luaran menjadikannya lebih mudah untuk mengubah CSS kemudian, kerana semua CSS ditakrifkan dalam satu tempat.

Untuk memaut ke fail CSS luaran anda, tambah baris berikut dalam dokumen HTML anda dalam elemen (selepas asas.css

Sebaik sahaja fail .css ini telah dibuat, edit fail dan tambahkan kod CSS yang sama, tidak termasuk tanda komen dan komen ke dalamnya, seperti yang ditunjukkan.

.tab {margin-left: 40px; }

Akhirnya, sebaik sahaja langkah-langkah di atas selesai, anda boleh tab apa-apa teks menggunakan yang sama

contoh yang telah kami tunjukkan di atas.

Terdapat juga bentuk indentasi lain. Sebagai contoh, jika anda hanya mahu mengindeks baris pertama perenggan, bukan menggunakan baris CSS di atas, anda akan menggunakan baris berikut.

.tab {text-indent: 40px}

Tip: Anda juga boleh indent menggunakan peratusan. Contohnya, bukan indentifikasi oleh 40px (piksel), anda boleh menggantikan indent dengan 5% untuk inden teks dengan 5% pandangan semasa. Anda juga boleh menggunakan ruang em apabila menentukan lebar inden.

Tip Bonus: Anda juga boleh menukar dari indent kiri ke indent kanan dengan menukar margin-left ke margin-right.

Kaedah yang disyorkan menggunakan HTML

Adalah mungkin untuk mencapai hasil yang sama di atas dengan menggunakan gaya inline dalam HTML. Semasa menggunakan contoh CSS di atas, boleh memudahkan untuk mengekalkan merentas beberapa halaman web, jika anda perlu menggunakan gaya hanya sekali anda boleh menggunakan contoh berikut.

Teks ini diindentikasi.

Dalam contoh pertama ini, semua teks dalam tag perenggan diindentikasi 40 piksel dari sebelah kiri. Sebarang tag perenggan lain tidak diindentikasi.

Teks ini diindentikasi.

Dalam contoh kedua ini, hanya baris pertama teks dalam perenggan akan diindentikasi 40 piksel dari kiri. Mana-mana garisan tambahan teks dalam perenggan itu tidak akan diindentikasi.

Tip: Anda juga boleh indent menggunakan peratusan. Contohnya, bukan indentifikasi oleh 40px (piksel), anda boleh menggantikan indent dengan 5% untuk inden teks dengan 5% pandangan semasa. Anda juga boleh menggunakan ruang em apabila menentukan lebar inden.

Tip Bonus: Anda juga boleh menukar dari indent kiri ke indent kanan dengan menukar margin-left ke margin-right.

Kaedah alternatif

Satu lagi cara yang biasa (tetapi tidak betul) mengindentikasi teks menggunakan tag, seperti yang ditunjukkan dalam contoh berikut. Walaupun ini adalah penyelesaian yang lebih mudah, terdapat masalah kebolehaksesan yang mungkin disebabkan oleh penggunaan penyelesaian ini untuk mengindeks teks anda. Tag ini dimaksudkan untuk mengutip teks dan bukan untuk indentasi.

Teks ini akan diindentikasi