Warna font diatur oleh atribut tag. Jenis font, ukuran font, warna, dan properti css lainnya untuk mengatur opsi font

Hari ini kami akan terus mempertimbangkan berbagai tag, yaitu Font, Blockquote, Pre, Strong, Em, B, I dan lainnya yang memungkinkan pemformatan teks.

Blockquote dan Pra - Pemformatan dalam HTML

Sebelum (sebelum CSS) tag kutipan Blokir V kode html cukup sering digunakan, karena fragmen teks yang terlampir di dalamnya menerima lekukan horizontal, yang tidak mudah dilakukan pada saat itu karena ketidakmungkinan menggunakan properti CSS. Elemen Blockquote adalah elemen berpasangan dan di dalamnya dapat berupa tag inline dan tag blok (misalnya, paragraf P).

Contoh

Contoh dibungkus dengan Blockquote

Sekarang tag Blockquote masih digunakan saat menata teks, namun kemunculan tanda kutip saat ini biasanya diatur menggunakan properti CSS yang ditulis khusus untuknya di file stylesheet template desain Anda. Misalnya, dalam kasus blog saya, di style.css Anda dapat menemukan baris berikut:

#content blockquote(margin:15px 0 20px 0;padding:5px 8px 5px 35px;background:#eaedf0 url(images/quote2.png) no-repeat left top;background-position:8px 5px;color:#666;font- size:14px;width:91%;font-style:italic;) #content blockquote p(color:#666;font-size:14px;)

Nah, Anda bisa melihat seperti apa kutipan yang terlampir di Blockquote dalam teks artikel dengan wawancara dengan pemimpinnya.

Selain kutipan dalam Html, tag pemformatan lain banyak digunakan sebelumnya (sebelum munculnya CSS) - Tengah. Itu dipasangkan (semacam wadah) dan blok. Ini dapat berisi elemen teks apa pun (baik sebaris maupun blok), yang sebagai akibat dari tindakan ini akan dipusatkan.

Jadi sekarang mari kita lihat tagnya Pra, yang memungkinkan Anda meneruskan pemformatan teks yang ditentukan langsung ke Kode sumber. Ingat, saya mengatakan bahwa semua yang berurutan (spasi, tab, dan jeda baris) akan diganti dengan satu spasi saat mem-parsing kode di browser.

Jadi, elemen Pra menonaktifkan singkatan spasi putih di bagian teks yang akan diapit di dalamnya. Hebatnya, untuk sebuah fragmen yang terlampir di Pre, browser tidak akan secara otomatis memutus garis pada spasi putih.

Itu. semua baris di dalam elemen Pre akan dianggap tidak rusak oleh browser - seperti yang Anda tulis di kode, itu akan ditampilkan di browser. Selain itu, di browser, untuk menampilkan bagian teks yang diformat dengan tag Pre, font monospace akan digunakan, seperti Courier New atau sejenisnya.

Pemformatan dalam tag kode sumber Pre tag tidak digunakan lagi

Tag Pre itu sendiri adalah tag blok, dan di dalamnya (tag ini dipasangkan) hanya konten sebaris yang dapat dilampirkan (yaitu, paragraf P, judul H1 - H6, dll. Tidak boleh ditempatkan di dalamnya).

Html memiliki tag blok lain yang dirancang untuk memformat teks - Alamat. Di dalam tag ini, menurut standar validator, hanya konten sebaris yang dapat ditemukan, yang akan ditampilkan dalam huruf miring di browser.

Font - berfungsi dengan warna dan font teks dalam Html murni

Kuat, Em - tag sorotan logis dan visual dalam teks

Jika CSS tidak ada sekarang, maka saya harus menjelaskan tujuan tag tertentu untuk pemformatan teks logis dan fisik (visual). Tapi karena CSS sekarang digunakan di sebagian besar situs, peran tag semacam itu dalam kode Html hampir dikurangi menjadi nol, jadi saya akan segera membahasnya dan menjelaskan mengapa tag tersebut digunakan sebelumnya (dan beberapa digunakan sekarang).

Tag visual dirancang untuk mengubah gaya teks yang akan terlihat oleh pengunjung situs Anda, tetapi tidak boleh diberikan Perhatian khusus mesin pencari.

Tag pemformatan teks logis, secara teori, diorientasikan untuk menunjukkan apa saja penekanan pada mesin pencari. Bagi pengguna, menyorot elemen ini juga akan mengubah tampilan kata yang dipilih.

Jika Anda ingat, belum lama ini, pengoptimal disarankan untuk mengalokasikan tempat-tempat penting dengan kata kunci (cara menyorot) dengan tag pemformatan logis Kuat dan EM, yang bagi pengguna akan terlihat seperti penyorotan tebal dan miring normal.

Tapi untuk pilihan tanpa kata kunci disarankan untuk menggunakan elemen Html "B" dan "I", yang bagi pengguna akan terlihat seperti penyorotan tebal dan miring, tetapi sudah mesin pencari tidak diperhitungkan, karena itu bukan tag pemformatan logis.

Sekarang semua ini secara praktis tidak berfungsi sebagaimana mestinya, dan kami melakukan pemilihan kata kunci dengan bantuan Strong dan EM lebih karena kebiasaan daripada benar-benar mengharapkan dividen tertentu untuk ini dari mesin pencari.

Jadi, selain "B" dan "I" yang telah disebutkan (disorot dengan huruf tebal dan miring) ke kategori pemformatan visual kita bisa sertakan Font, Pre sudah dibahas di awal artikel, serta tag :

1. "U" - sorot garis bawah
2. "Strike" - coret
3. "Sup" - superskrip
4. "Sub" - subskrip
5. "Tt" - pemilihan dalam font monospace
6. "Besar" - perbesar font
7. "Kecil" - kurangi font

Nah, sekarang mari kita lihat daftar elemennya pemformatan logis teks:

1. "Em" - pemilihan logis dari fragmen penting dalam huruf miring
2. "Kuat" - sama, tetapi hanya akan menonjol dengan huruf tebal
3. "Kutip" - tandai kutipan dengan huruf miring
4. "Kode" - dirancang untuk menampilkan berbagai kode dalam font monospace
5. "Samp" - untuk memilih beberapa karakter dalam font monospace
6. "Abbr" - dalam atribut Judul dari tag ini, decoding singkatan apa pun ditulis (seperti CSS atau Html, yang dibaca dengan huruf, dan bukan sebagai satu kata). Kata-kata yang tertulis di Judul akan muncul saat Anda menggerakkan kursor mouse di atas singkatan ini.
7. "Akronim" adalah sama, tetapi digunakan untuk akronim, mis. singkatan yang tidak dibaca dengan huruf, tetapi sebagai kata (misalnya MKAD atau GAI)
8. "Kbd" - digunakan untuk menampilkan dalam font monospace teks yang dimasukkan oleh pengguna situs dari keyboard
9. "Var" - digunakan untuk memiringkan variabel dalam beberapa kode
10. "Del" - menyorot dengan coretan, saat Anda ingin menunjukkan bahwa beberapa fragmen telah dihapus setelah publikasi dokumen Html
11. "Ins" - menggarisbawahi saat Anda perlu menunjukkan bahwa beberapa bagian telah disisipkan setelah publikasi dokumen Html

Saya ulangi sekali lagi bahwa tag pemformatan ini sebagian besar sangat jarang saat menulis kode sekarang, tetapi tetap tidak akan berlebihan untuk mengetahui tujuannya.

Semoga beruntung untukmu! Sampai jumpa di halaman blog situs

Anda mungkin tertarik

Karakter spasi putih dan pemformatan kodenya dalam Html, serta karakter khusus spasi tanpa putus dan mnemonik lainnya
Bagaimana warna diatur dalam kode Html dan CSS, pemilihan warna RGB dalam tabel, hasil Yandex, dan program lainnya Select, Option, Textarea, Label, Fieldset, Legend - tag Formulir HTML daftar dropdown dan kotak teks
Daftar dalam kode Html - tag UL, OL, LI dan DL
Cara membuat hyperlink (A, Href, Target blank), cara membukanya di jendela baru di situs, dan juga membuat tautan gambar dalam kode Html
Tabel dalam tag Html - Tabel, Tr dan Td, serta Colspan, Cellpadding, Cellspacing, dan Rowspan untuk membuatnya
Tag heading dan atribut H1-H6, garis horisontal Hr, jeda baris Br dan paragraf P sesuai standar Html 4.01
Apa itu Html Hypertext Markup Language dan bagaimana cara mendaftar semua tag di validator W3C
Img - Tag html untuk menyisipkan gambar (Src), menyelaraskan dan membungkusnya dengan teks (align), serta mengatur latar belakang (background)
Arahan komentar dan Doctype dalam kode Html, serta konsep blok dan elemen sebaris (tag)

Dalam html, ukuran font memainkan peran penting. Ini menarik perhatian pengguna informasi penting diposting di halaman website. Meski bukan hanya ukuran huruf yang penting, tapi juga warna, ketebalan bahkan kekeluargaannya.

Tag dan atribut saat bekerja dengan font html

Bahasa hypertext memiliki banyak alat untuk bekerja dengan font. Bagaimanapun, pemformatan teks adalah tugas utama html .

Alasan pembuatan bahasa HTML adalah masalah menampilkan aturan pemformatan teks oleh browser.