Atribut tag font. Cara membuat font cantik di html: ukuran, warna, tag font html. dengan nama model yang berbeda

03.04.2020 drive SSD

Di artikel terakhir saya memberi tahu Anda tentang cara menggunakannya, dll. Dan hari ini saya akan bercerita tentang bagian integral lainnya dalam pembuatan website yaitu tentang atribut tag html. Dan tentu saja, menurut tradisi, kami akan melihatnya menggunakan contoh langsung dan mencobanya di situs web kami dengan Lukomorye, yang kami perkenalkan di artikel terakhir.

Atribut adalah tambahan khusus pada tag yang memperluas kemampuannya dan dapat mengubah properti konten. Dan jika tagnya selalu tetap, maka atribut tersebut dapat memiliki banyak nilai. Misalnya saja pada tag kita dapat meletakkan atribut warna teks, ukuran teks, font, dll. Namun kita akan melihat font lebih detail di artikel lain.

Ada atribut universal dan non-universal. Yang universal cocok untuk hampir semua tag, dan yang non-universal cocok untuk satu atau lebih, tetapi tidak semua...

Atribut ditulis di dalam tag setelah nilainya, tetapi sebelum tanda kurung siku penutup. Pertama, atribut itu sendiri ditempatkan, lalu tanda sama dengan, dan kemudian nilai itu sendiri dalam tanda kutip. Ini terlihat seperti ini:

Teks

Apa yang berikut dari contoh ini? Kami membuka sebuah paragraf, dan di dalam tag kami mengatur atribut align, yang bertanggung jawab untuk menyelaraskan teks. Selanjutnya kita beri tanda “=” yang artinya kita memberikan nilai pada atribut tersebut. Di bawah ini kami menulis nilai ini dalam tanda kutip. Dalam hal ini adalah "pusat". Artinya, teks dalam paragraf ini (dan hanya ini!) akan berada di tengah. Cobalah sendiri.

Tapi jangan lupa untuk memeriksa situs webnya htmlbuku. Di sana Anda pasti akan menemukan apa yang cocok dengan apa. Ini hanyalah referensi desktop untuk pengembang web mana pun, terutama pemula.

Meluruskan

Seperti yang sudah Anda pahami, atribut ini berarti perataan teks. Biasanya ditempatkan di tag yang bertanggung jawab atas konten itu sendiri (teks, gambar, dll.). Secara umum, Anda dapat meletakkannya di judul (

,...,

), dalam paragraf (

), gambar , elemen blok (

).

Nilai atribut yang mungkin:

  • kiri — perataan kiri (default)
  • kanan — perataan kanan
  • tengah - perataan tengah
  • justify - perataan lebar penuh

Cobalah berlatih dan lihat bagaimana susunan elemen Anda berubah.

Judul

Nama yang familiar, bukan? Benar-benar. Ada tag seperti itu, dan kami meletakkannya di antaranya Dan . Namun sekarang saya berbicara secara khusus tentang atribut, dan atribut ini cocok untuk hampir semua tag, karena bersifat universal. Dan itu diperlukan sebagai petunjuk saat melayang. Dan intinya adalah Anda sendiri yang menulis petunjuk ini. Ini terlihat seperti ini:

Apa itu 5-3?

Apa yang kita lihat di sini? Pertama kita buka paragrafnya, lalu kita tulis atributnya sendiri dan beri nilai “Kenapa kamu bodoh? Akan ada 2." Selanjutnya kita menulis teks yang ditampilkan, dan pada akhirnya kita menutup tag

.

Apa yang terjadi setelah ini? Simpan dokumen dan lihat sendiri. Saat Anda mengarahkan kursor ke teks, keterangan alat akan muncul.

Beragam arti

Satu tag dapat berisi sejumlah atribut. Yang utama adalah mereka cocok dengan label ini. Berikut ini contohnya:

Isi

Seperti yang Anda lihat, semuanya cukup sederhana di sini, Anda hanya perlu menulis semua atribut dengan dipisahkan spasi dalam satu tag. Dari contoh ini kita melihat bahwa konten akan disejajarkan ke kanan, dan ketika kita mengarahkan kursor mouse ke atasnya, tooltip akan muncul. Sederhana saja. Saya harap semuanya jelas?

Baiklah, sekarang mari kita kembali ke Lukomorye yang kita lakukan pada pelajaran terakhir.

Contoh hidup

  • Sejajarkan semua teks dalam dokumen dengan "Lukomorye" ke tengah (beserta judulnya),
  • Pada judul tingkat pertama, beri petunjuk “Penulis karya ini adalah A.S. pushkin"

Jika Anda belum memiliki file lengkap dari pelajaran sebelumnya, ambillah dan masukkan semua atribut yang diperlukan agar semuanya berfungsi sesuai tugas.

Dan menurut tradisi, pada awalnya, lakukan semuanya sendiri. Dan jika masih belum berhasil, maka simak langkah-langkah yang saya tulis dibawah ini.


Setelah itu simpan dokumen html dan jalankan. Mari kita periksa apa yang kita punya. Apakah semuanya benar? Saya pikir semuanya akan berhasil untuk Anda. Tapi tetap saja, saya merasa banyak dari Anda yang bosan mencantumkan atribut di setiap syair. Saya akan menunjukkan cara membuat proses ini lebih mudah.

Jika Anda perlu meletakkan atribut yang sama ke beberapa segmen besar, maka tag akan membantu kami dalam hal ini

. DIV hanyalah sebuah elemen blok kosong yang berfungsi sebagai semacam wadah untuk pengelompokan. Anda dapat menempatkan berbagai atribut di sini untuk tujuan menerapkannya pada fragmen umum. Dan jika biasanya Anda ingin menerapkan atribut ke seluruh dokumen, biasanya Anda dapat menuliskannya di tag utama .

Secara umum, dalam hal ini, Anda tidak perlu meletakkan atribut align="center" di setiap tag. Anda hanya perlu meletakkannya

sebelum judul, dan tutup dengan
di akhir seluruh teks. Ya, di dalam
setel align="center" , tetapi hanya sekali. Menurut pendapat saya, ini jauh lebih cepat dan nyaman dan pada akhirnya hal yang sama terjadi.

Jadi bagaimana? Menemukan jawabannya prinsip umum? Kami hanya akan terus belajar lebih banyak lagi. Yang penting Anda memahami prinsip penataan tag dan atribut. Jika perlu, ajukan pertanyaan Anda. Saya akan dengan senang hati menjawabnya.

Nah, untuk pelatihan lengkap tentang prinsip membuat situs web, saya sarankan menonton kursus video yang luar biasa " HTML5 dan CSS3 dari awal hingga profesional". Di sana Anda akan belajar HTML, CSS, mempelajari cara menata situs kartu nama, blog, dan bahkan toko online. Kursus ini sungguh luar biasa untuk pengembang web pemula.

Baiklah, aku sudah selesai untuk hari ini. Saya harap Anda menyukai artikel ini dan merasakan manfaatnya. Jangan lupa berlangganan pembaruan blog saya untuk selalu mengetahui hal-hal paling menarik dan tidak ketinggalan pelajaran baru. Baiklah, aku mengucapkan selamat tinggal padamu untuk hari ini. Saya berharap Anda sukses dalam menguasai materi. Sampai jumpa!

Hormat kami, Dmitry Kostin.

Selain menggunakan ukuran dan gaya font standar (tipografi), Anda dapat menentukan font untuk setiap fragmen teks menggunakan tag khusus. Cara termudah adalah dengan menggunakan apa yang disebut gaya fisik:

Untuk setiap tag gaya fisik, terdapat tag penutup terkait yang menonaktifkan penerapan gaya lebih lanjut. Misalnya untuk tag tag penutupnya adalah.
Di bawah ini adalah contoh program dan penampilan gaya fisik yang berbeda:


<НЕАD><ТIТLЕ>Gaya fisik

<В>Berani
Huruf miring
Tertekan
Dicoret
<ТТ>Mesin tik
<ВХ1>Miring tebal
<ВХ1><и>Bergaris bawah miring tebal


Beras. 649. Gaya fisik

Anda dapat memasukkan tag gaya fisik ke dalam tag judul untuk mengubah seluruh judul atau hanya sebagian saja. Misalnya, untuk mencetak miring bagian teks yang ditetapkan sebagai judul, Anda dapat menggunakan konstruksi berikut:


<НЕАD><ТIТLЕ>Gaya Fisik dan Logis

<Н2>Ini - dimodifikasi tajuk tingkat 2

Beras. 650. Mengubah gaya font sebagian judul

Menggunakan tag khusus Anda dapat menyesuaikan font untuk gambar teks: mengatur jenis huruf, ukuran dan warna. Pertama-tama, Anda dapat mengatur ukuran font utama yang digunakan dalam dokumen secara default. tag font utama memiliki format . Ukuran font utama dapat diatur dari 1 hingga 7. Jika Anda tidak menggunakan tag ini, ukuran font utama default diatur ke 3.
menandai mengatur ukuran font saat ini untuk masing-masing fragmen teks. Tag ini tidak mempengaruhi gaya. Kisaran nilai yang mungkin adalah dari 1 hingga 7. Tag ini juga memungkinkan Anda mengontrol ukuran font saat ini dibandingkan dengan font utama. Untuk melakukannya, gunakan simbol + (untuk memperbesar) dan simbol - (untuk memperkecil) ukuran font dengan jumlah tertentu. Misalnya, jika ukuran font body disetel ke 3, maka tag mengatur ukuran font saat ini menjadi 5.
Untuk mengatur jenis huruf font, gunakan tag . Misalnya:

Jika tag ini tidak digunakan dalam dokumen Anda, maka browser akan menggunakan kumpulan font sesuai preferensinya. Oleh karena itu, teks di layar pengguna mungkin terlihat sangat berbeda dari yang Anda bayangkan. Anda juga harus ingat bahwa jika font yang Anda tentukan tidak diinstal pada komputer pengguna, browser akan menampilkan teks dalam font default.
Anda bisa di tag menunjukkan daftar font yang dipisahkan dengan koma. Dalam hal ini, browser akan menggunakan font pertama yang ditemukan. Misalnya, Anda dapat menulis tag:

WAJAH="Arial, Sans Serif, Kurir">

Biasanya, font serupa ditentukan dalam daftar. Disarankan untuk menetapkan font yang paling populer. Saat ditempatkan di halaman informasi teks Lebih baik tidak menetapkan nama font sama sekali, bergantung pada pengaturan browser standar. Namun, saat mendesain halaman, Anda juga harus menggunakan pengaturan browser standar untuk menyinkronkan persepsi Anda terhadap teks dengan kemungkinan persepsi pengguna. Bagaimanapun, Anda membuat halaman bukan untuk diri Anda sendiri, tetapi untuk pembaca Anda.
Dengan menggunakan Atribut WARNA di tag Anda dapat mengatur warna font:

Argumen atribut COLOR merupakan representasi heksadesimal dari kode warna (komponen merah, hijau, dan biru alias komponen RGB).


<НЕАD><ТIТLЕ>Program berikut menunjukkan manajemen font:

<Р>Menginstal font font Aria
<Р>ABVGDEZZHIK Font kurir
<Р>ABVGDEZZHIK Font kurir


SIMBOL Font

Beras. 651. Menggunakan font yang berbeda Perhatikan itu di tag

Anda dapat menggunakan beberapa atau semua atribut yang mungkin. Misalnya: DI DALAM rumus matematika , serta untuk catatan kaki, sering digunakan indeks yang berbeda dari teks utama dalam hal posisi (sedikit lebih tinggi atau lebih rendah) dan ukurannya. Tag melayani tujuan ini Dan


<НЕАD><Т1ТLЕ>masing-masing untuk indeks atas dan bawah.Indeks

<НЗ>/KEPALA>
<Р>(5+x 2)x+3

A 1+ sebuah 2+ sebuah 3
<Р>Catatan kaki 2



Beras. 832. Menggunakan superskrip dan subskrip

Selain yang dibahas di atas, ada tag pemformatan teks tambahan:

  • - pemilihan alamat email, alamat pos dan
    nomor telepon;
  • <СIТЕ> - menyorot kutipan;
  • , - merekam teks program, konstanta simbolik;
  • - memasukkan teks dari keyboard.

Tiga gaya terakhir menggunakan font monospace (biasanya Courier).
Misalnya huruf I dan Ж dalam font monospace menempati ruang yang sama. Penggunaan font monospace karena kemudahan perataan teks menggunakan karakter spasi. Mari kita perhatikan satu hal lagi. Tag kontrol font, seperti tag gaya logis, dapat menyertakan atribut JUDUL= "rangkaian", yang memungkinkan Anda melampirkan keterangan alat ke teks di dalam tag ini.

Argumen atribut JUDUL adalah string petunjuk. Saat penunjuk tetikus bertumpu pada kata atau frasa yang disorot, keterangan alat akan muncul di sebelah penunjuk. Dengan menggunakan teknik ini, Anda dapat menguraikan singkatan dan memberikan penjelasan tambahan serta rekomendasi kepada pengguna.

Menandai
Teks

FONT
merupakan wadah untuk mengubah karakteristik font seperti ukuran, warna dan jenis huruf. Meskipun tag ini masih didukung oleh semua browser, tag ini dianggap sudah usang dan disarankan untuk mengabaikan penggunaannya demi gaya.

Sintaksis
Tag penutup
Diperlukan.
Pilihan

warna - warna teks.



wajah - font teks.ukuran - ukuran font.

Contoh 1: Menggunakan tag FONT

P

Huruf pertama kalimat ini akan ditulis dengan font Arial, berwarna merah dan diperbesar ukurannya.

Hasil

Huruf pertama kalimat ini akan ditulis dengan font Arial, berwarna merah dan diperbesar ukurannya.
Deskripsi parameter tag FONT

Menandai
...

Parameter WARNA
Keterangan Mengatur warna teks di dalam wadah FONT..

Argumen

Untuk mengatur warna, digunakan dua metode: yang pertama menggunakan sebutan warna dalam kode heksadesimal, dan yang kedua menggunakan nama beberapa warna. Metode yang didasarkan pada sistem bilangan heksadesimal paling banyak digunakan, karena merupakan metode yang paling universal. Sistem desimal, meskipun lebih familiar untuk representasi, hanya digunakan dengan 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
Heksadesimal 1 2 3 4 5 6 7 8 9 A B C D E F

Bilangan yang lebih besar dari 15 pada sistem heksadesimal dibentuk dengan menggabungkan dua bilangan menjadi satu. Misalnya, angka 255 dalam desimal sama dengan angka FF dalam heksadesimal. Untuk menghindari kebingungan dalam menentukan sistem bilangan, sebelumnya angka heksadesimal beri simbol hash #, misalnya #666999.

Warna khasnya terlihat seperti ini.

#FA8E47>Teks

Warna latar belakang diatur ke #FA8E47. Simbol hash # di depan angka berarti heksadesimal. Dua digit pertama ( F.A.) tentukan komponen warna merah, angka dari ketiga sampai keempat ( 8E) - hijau, dan dua digit terakhir ( 47 ) - biru. Hasil akhirnya adalah warna ini.

F.A. + 8E + 47 = FA8E47

Masing-masing dari tiga warna - merah, hijau dan biru - dapat mengambil nilai dari 00 hingga FF, menghasilkan total 256 warna. Jadi pada model RGB jumlah kombinasi warnanya bisa menjadi 256 x 256 x 256 = 16.777.216.

Mirip dengan CSS
warna

Nilai bawaan
Warna default browser.

Contoh 2: Warna latar belakang teks





Hasil

Parameter WAJAH

Huruf pertama kalimat ini akan ditulis dengan font Arial, berwarna merah dan diperbesar ukurannya.
Parameter wajah digunakan untuk menentukan jenis huruf yang digunakan untuk teks. Anda dapat mencantumkan beberapa nama font, dipisahkan dengan koma. Dalam hal ini, jika font pertama yang ditentukan tidak ditemukan, browser akan menggunakan font berikutnya dalam daftar.

Menandai
...

Parameter WARNA
Sejumlah nama font dipisahkan dengan koma. Keluarga font universal:
serif - font serif (antik), seperti Times;
sans-serif - font sans-serif (font tanpa serif atau sans serif), perwakilan tipikalnya adalah Arial;
kursif - font kursif;
fantasi - font dekoratif;
monospace - font monospace, lebar setiap karakter dalam keluarga ini sama.

Mirip dengan CSS
font-keluarga

Nilai bawaan
Font default di browser.

Contoh 3: Mengubah font



Lorem ipsum dolor sit amet, pembentuk adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.

Hasil

Lorem ipsum dolor sit amet, pembentuk adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.

Parameter UKURAN

Huruf pertama kalimat ini akan ditulis dengan font Arial, berwarna merah dan diperbesar ukurannya.
Menentukan ukuran font dalam satuan sembarang dari 1 hingga 7. Ukuran rata-rata yang digunakan secara default adalah 3. Ukuran font dapat ditentukan sebagai nilai absolut (misalnya, ukuran=4) atau sebagai nilai relatif (misalnya, ukuran =+1, ukuran=-1 ). Dalam kasus terakhir, ukurannya berubah relatif terhadap ukuran dasar. Ukuran font tidak hanya terpengaruh parameter yang diberikan ukuran, tetapi juga pilihan jenis huruf. Jadi, font Arial terlihat lebih besar daripada font Times, dan font Verdana sedikit lebih banyak font Arial. Pertimbangkan fitur ini saat memilih font dan ukurannya.

Menandai
...

Parameter WARNA
Bilangan bulat dari 1 hingga 7, atau mengubah nilainya ke atas atau ke bawah menggunakan simbol + dan -.

Mirip dengan CSS
ukuran font

Nilai bawaan
3

Contoh 4: Ukuran teks



Ukuran huruf 1

Ukuran huruf 2

Ukuran huruf 3

Ukuran huruf 4

Ukuran huruf 5

Ukuran huruf 6

Ukuran huruf 7

Hasil

Ukuran huruf 1
Ukuran huruf 2
Ukuran huruf 3
Ukuran huruf 4
Ukuran huruf 5
Ukuran huruf 6
Ukuran huruf 7
Peramban Penjelajah Internet Netscape Opera Safari Mozilla Firefox
Versi 5.5 6.0 7.0 6.0 7.0 8.0 7.0 8.0 9.0 1.0 1.7 1.0 2.0
Didukung Ya Ya Ya Ya Ya Ya Ya Ya Ya Ya Ya Ya Ya

Keterangan

Argumen atribut merupakan wadah untuk mengubah karakteristik font seperti ukuran, warna dan jenis huruf. Meskipun tag ini masih didukung oleh semua browser, tag ini dianggap sudah usang dan disarankan untuk mengabaikan penggunaannya demi gaya.

Sintaksis

Teks

Tag penutup

merupakan wadah untuk mengubah karakteristik font seperti ukuran, warna dan jenis huruf. Meskipun tag ini masih didukung oleh semua browser, tag ini dianggap sudah usang dan disarankan untuk mengabaikan penggunaannya demi gaya.

Pilihan

color Mengatur warna teks. face Menentukan jenis huruf font. size Mengatur ukuran font dalam satuan konvensional.

Contoh 1: Menggunakan tag





tanda FONT


wajah - font teks. Huruf pertama kalimat ini ditulis dengan font Arial, disorot dengan warna merah dan diperbesar ukurannya.



Deskripsi parameter tag

Hasil

Keterangan

Mengatur warna teks di dalam wadah .

Sintaksis

...

Argumen

Nilai warna dapat diatur dengan dua cara.

1. Berdasarkan namanya

Browser mendukung beberapa warna berdasarkan namanya.

2. Dengan nilai heksadesimal

Angka heksadesimal digunakan untuk menentukan warna. Sistem heksadesimal, tidak seperti sistem desimal, seperti namanya, didasarkan pada angka 16. Angka-angkanya adalah sebagai berikut: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. Angka 10 sampai 15 diganti dengan huruf latin. Bilangan yang lebih besar dari 15 pada sistem heksadesimal dibentuk dengan menggabungkan dua bilangan menjadi satu. Misalnya, angka 255 dalam desimal sama dengan angka FF dalam heksadesimal. Untuk menghindari kebingungan dalam menentukan sistem bilangan, simbol hash # diletakkan sebelum bilangan heksadesimal, misalnya #666999. Masing-masing dari tiga warna - merah, hijau dan biru - dapat mengambil nilai dari 00 hingga FF. Jadi, simbol warna dibagi menjadi tiga komponen #rrggbb, dimana dua simbol pertama menunjukkan komponen warna merah, dua simbol di tengah menunjukkan komponen hijau, dan dua simbol terakhir menunjukkan komponen warna biru.

Mirip dengan CSS

Nilai bawaan

Warna default browser.

Parameter WAJAH

Keterangan

Parameter wajah digunakan untuk menentukan jenis huruf yang digunakan untuk teks. Anda dapat mencantumkan beberapa nama font, dipisahkan dengan koma. Dalam hal ini, jika font pertama yang ditentukan tidak ditemukan, browser akan menggunakan font berikutnya dalam daftar.

Sintaksis

...

Argumen

Sejumlah nama font dipisahkan dengan koma. Keluarga font universal:
serif - font serif (antik), seperti Times;
sans-serif - font sans-serif (font tanpa serif atau sans serif), perwakilan tipikalnya adalah Arial;
kursif - font kursif;
fantasi - font dekoratif;
monospace - font monospace, lebar setiap karakter dalam keluarga ini sama.

Mirip dengan CSS

Nilai bawaan

Font default di browser.

Parameter UKURAN

Keterangan

Menentukan ukuran font dalam satuan sembarang dari 1 hingga 7. Ukuran rata-rata yang digunakan secara default adalah 3. Ukuran font dapat ditentukan sebagai nilai absolut (misalnya, size="4" ) atau sebagai nilai relatif (misalnya , ukuran="+1" , ukuran="-1" ).

Sintaksis

...

Argumen

Dalam kasus terakhir, ukurannya berubah relatif terhadap ukuran dasar. Ukuran font tidak hanya dipengaruhi oleh parameter ukuran yang ditentukan, tetapi juga oleh pilihan jenis font. Dengan demikian, font Arial terlihat lebih besar dari font Times, dan font Verdana sedikit lebih besar dari font Arial. Pertimbangkan fitur ini saat memilih font dan ukurannya.

Bilangan bulat dari 1 hingga 7, atau mengubah nilainya ke atas atau ke bawah menggunakan simbol + dan -.

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

Blockquote dan Pra - format HTML Sebelumnya (bahkan sebelum munculnya CSS) tag kutipan kutipan blok V kode HTML

cukup sering digunakan karena bagian teks yang terlampir di dalamnya diberi lekukan horizontal, yang pada saat itu tidak mudah dilakukan karena ketidakmungkinan menggunakan properti CSS. Elemen Blockquote dipasangkan dan dapat berisi tag sebaris dan tag blok (misalnya, paragraf P).

Contoh

Contoh terlampir dalam Blockquote

Saat ini, tag Blockquote masih digunakan saat mendesain teks, namun tampilan tanda kutip saat ini biasanya diatur menggunakan properti CSS yang ditentukan khusus untuk itu di file stylesheet template desain Anda. Misalnya, dalam kasus blog saya, di style.css Anda dapat menemukan baris berikut:

Nah, Anda bisa melihat bagaimana kutipan yang disertakan dalam Blockquote akan terlihat di teks artikel dengan wawancara dengan manajer.

Selain kutipan dalam Html sebelumnya (sebelum munculnya CSS), tag pemformatan lain cukup banyak digunakan - Tengah. Dipasangkan (semacam wadah) dan diblok. Ini dapat berisi elemen teks apa pun (baik garis maupun blok), yang sebagai hasil dari tindakan ini akan disejajarkan di tengah.

Jadi, sekarang mari kita lihat tagnya Pra, yang memungkinkan Anda mentransfer format teks yang ditentukan secara langsung ke kode sumber. Ingat saya mengatakan bahwa semua yang berurutan (spasi, tab, dan jeda baris) akan diganti dengan satu spasi saat mengurai kode di browser.

Jadi, unsur Pra menonaktifkan pemendekan karakter spasi putih di bagian teks yang akan dilampirkan di dalamnya. Yang perlu diperhatikan adalah bahwa untuk sebuah fragmen yang disertakan dalam Pra, browser tidak akan mengimplementasikannya transfer otomatis baris dengan karakter spasi.

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

Pemformatan dalam tag kode sumber Tag awal sudah usang

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

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

Font - bekerja dengan warna teks dan font dalam Html murni

Kuat, Em - tag untuk penyorotan logis dan visual dalam teks

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

Tag visual dirancang untuk mengubah gaya teks yang akan terlihat oleh pengunjung situs Anda, namun mesin pencari tidak perlu memberikan perhatian khusus.

Tag pemformatan teks logis, secara teori, berorientasi untuk menunjukkan apa pun aksen untuk mesin pencari. Bagi pengguna, menyorot dengan elemen ini juga akan mengubah tampilan kata yang disorot.

Jika Anda ingat, belum lama ini, pengoptimal disarankan untuk menyorot tempat-tempat penting dengan kata kunci (sebagaimana seharusnya disorot) dengan tag pemformatan logis Kuat dan EM, yang bagi pengguna akan terlihat seperti huruf tebal dan miring biasa.

Namun untuk pilihan tanpa kata kunci disarankan menggunakan elemen HTML“B” dan “I”, yang lagi-lagi akan terlihat seperti huruf tebal dan miring bagi pengguna, namun tidak diperhitungkan oleh mesin pencari, karena itu bukan tag pemformatan logis.

Sekarang semua ini praktis tidak lagi berfungsi sebagaimana mestinya, dan kami melakukan pemilihan kata kunci menggunakan Strong dan EM lebih karena kebiasaan, daripada benar-benar mengharapkan keuntungan tertentu dari mesin pencari.

Jadi, selain “B” dan “I” yang sudah disebutkan (dicetak tebal dan miring) untuk kategori tersebut pemformatan visual Ini termasuk Font, Pra, yang sudah dibahas di awal artikel, serta tag:

  1. "U" - menggarisbawahi
  2. "Menyerang" - mencoret
  3. "Sup" - superskrip
  4. "Sub" - subskrip
  5. "Tt" - font monospace
  6. "Besar" - menambah font
  7. "Kecil" - kurangi fontnya

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

  1. "Em" - penyorotan logis dari fragmen penting dalam huruf miring
  2. “Kuat” juga sama, tetapi hanya akan menonjol jika dicetak tebal
  3. "Kutip" - miringkan kutipan
  4. "Kode" - dirancang untuk menampilkan berbagai kode dengan font monospace
  5. "Samp" - untuk menyorot beberapa karakter dengan font monospace
  6. “Abbr” - atribut Judul dari tag ini berisi penguraian singkatan (seperti CSS atau Html, yang dibaca dengan huruf, dan bukan sebagai satu kata). Kata-kata yang tertulis di Judul akan muncul ketika Anda mengarahkan kursor mouse ke singkatan ini.
  7. “Akronim” adalah hal yang sama, tetapi digunakan untuk akronim, yaitu singkatan yang dibaca bukan per huruf, melainkan kata (misalnya MKAD atau Gai)
  8. "Kbd" - digunakan untuk menampilkan teks yang dimasukkan oleh pengguna situs dari keyboard dalam font monospace
  9. "Var" - digunakan untuk mencetak miring variabel dalam beberapa kode
  10. "Del" - menyorot dengan coretan ketika Anda ingin menunjukkan bahwa beberapa fragmen telah dihapus setelah menerbitkan dokumen Html
  11. "Ins" - menggarisbawahi ketika Anda perlu menunjukkan bahwa beberapa bagian telah disisipkan setelah publikasi dokumen Html

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

Semoga beruntung untukmu! Sampai jumpa lagi di halaman situs blog

Anda mungkin tertarik

Karakter spasi putih dan format kodenya dalam Html, serta karakter khusus ruang yang tidak dapat dipecahkan dan mnemonik lainnya
Bagaimana warna diatur dalam kode Html dan CSS, pemilihan warna RGB dalam tabel, keluaran Yandex, dan program lainnya Pilih, Opsi, Textarea, Label, Fieldset, Legenda - tag formulir HTML daftar drop-down dan bidang teks
Daftar dalam kode Html - tag UL, OL, LI dan DL
Cara membuat hyperlink (A, Href, Target blank), cara membukanya di jendela baru situs, dan juga menjadikan gambar link dalam kode Html
Tabel dalam Html - Tag Tabel, Tr dan Td, serta Colspan, Cellpadding, Cellspacing, dan Rowspan untuk membuatnya
Tag dan atribut heading H1-H6, garis horizontal Hr, line break Br dan paragraf P sesuai standar Html 4.01
Apa itu bahasa markup hypertext Html dan cara melihat daftar semua tag di validator W3C
Gambar- tanda HTML untuk menyisipkan gambar (Src), meratakan dan membungkus teks disekitarnya (align), serta mengatur latar belakang (background)
Arahan komentar dan Doctype dalam kode Html, serta konsep elemen blok dan inline (tag)