HTML apgūšana 9. daļa: Kā HTML tekstā mainīt krāsu un fontu tipus
Krāsu izvēle teksta un fonta tipamkas tiek izmantots HTML dokumentiem, kurus mēs izgatavojam, ir viena no svarīgākajām lietām, kurai jāpievērš uzmanība un uzmanība. Fonti ir dokumentā izmantoto burtu veids.
Ir vairākas lietas, kurām mums jāpievērš uzmanībapiemēram, vai fonta tips, kas tiek piemērots saskaņā ar vietnes dizainu, vai izmantotais fonta tips ļauj apmeklētājiem viegli lasīt vietnes saturu, vai fonta tips atbilst vietnes tēmai vai tēmai, vai saturam un vai izmantotā teksta krāsa atbilst fonam un neapgrūtina apmeklētājus. lasīt tekstu un tā tālāk.
Pats HTML nodrošina elementusīpaši, lai regulētu fontu un krāsu izmantošanu HTML dokumentos. Ir daudz veidu fontu, kurus mēs varam izmantot, taču mums arī jāatceras, ka fonti, kas kopumā tiks parādīti tīmekļa pārlūkprogrammā, nāk no lietotāja datora. Nav problēmu, ja izmantotais pārlūks ir no mūsu datora, bet, ja tas tiek atvērts cita datora pārlūkprogrammā, izstrādātais tīmekļa dizains var kļūt haotisks, jo izmantotais fonta tips šajā datorā nav pieejams.
Tāpēc tiek izmantoti standarta fontiparasti ir pieejams operētājsistēmās Windows, Linux, Mac OS un citās. Standarta fontus parasti atbalsta lielākā daļa tīmekļa pārlūkprogrammu, tāpēc jums nav jāuztraucas. Var izmantot šādus standarta fontus:
1. Serifa fontu veidi
Serif fonts ir tāda veida fonts, kuram ir kājaskatrā vēstulē, piemēram, Times New Roman un Georgia. Šāda veida fonts parasti ir ātrs un viegli lasāms, tāpēc to parasti izmanto papīra drukas materiāliem.
2. Monospace fontu tipi
Monospace fonti ir fontu tipi, kuru rakstzīmes ir vienāda platuma kā Courier, Courier New un Andale Mono. Tā rakstura dēļ šis fonts parasti tiek izmantots programmu rakstīšanai.
3. Sans-Serif fontu tipi
Sans-serif fonts ir tāda veida fonts, kura navkatrā burtā ir kājas, piemēram, Arial, Verdana, Trebuchet MS, Helvetica un Calibri. Šis fonts vietnēs bieži tiek izmantots kā fonta tips.
4. Kursējošie fontu veidi
Kursīvs fonts ir tāda veida fonts, kas imitē kaligrāfiju vai rokrakstu, piemēram, Comic Sans. Šis fonts parasti tiek izmantots rakstīšanas aspektiem, kas nav pārāk formāli.
5. Fantāzijas fontu veidi
Fantāzijas fonts ir fonta tips, kas ir vizuāls ar īpašām fonta rakstzīmēm, piemēram, fonta matricu, Disney un citiem, un to reti izmanto lapas tekstam.
Lai jūs labāk saprastu teksta krāsu un fonta veidu HTML, apskatīsim tālāk sniegto skaidrojumu:
Elementa fonts
Izmantojot fontu tagus, jūs varat pielāgot vai mainīt teksta krāsu un izmēru. Varat arī izmantot fonta elementus, kurus nodrošina HTML.
Šī elementa izmantošanu apzīmē ar atzīmi <0000 un beidzas ar atzīmi </font> Teksta krāsas un lieluma maiņa tiek veikta, izmantojot atribūtus, kas atrodas fonta elementā, proti:
| Atribūts | Funkcija |
| Seja | Norāda tīmekļa lapā izmantotā fonta veidu |
| Krāsa | Norādiet izmantotā teksta krāsu |
| Izmērs | Norāda teksta lielumu ar vērtībām no 1 līdz 7 |
Šeit ir koda piemērs fontu tagu izmantošanai HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Elemen Font</title>
</head>
<body>
<p><font face="Courier New" color="green" size="3">Claudio Andres Bravo Munoz menandatangani kontrak sebagai kiper FC Barcelona pada musim panas 2014 berasal dari Real Sociedad. Lahir pada 13 April 1983, di kota kecil Viluco de Buin, di daerah Santiago Cile. Ia mulai bermain sepak bola sejak kecil, walaupun awalnya bukanlah sebagai seorang kiper, sebaliknya ia bermain sebagai seorang striker dan kemudian menjadi pemain bertahan.</font></p>
</body>
</html>Pēc iepriekš norādītā koda izpildes pārlūkā tas izskatīsies šādi:
Pašreizējā lietojumā tikai tags <0000atbalsta HTML 4.01, bet neatbalsta pat HTML5. Tas ir tāpēc, ka tagu <atible] var aizstāt ar CSS, kur CSS funkcijas ir daudz labākas un efektīvākas nekā tags <REE.
Šis ir CSS izmantošanas piemērs fonta iestatījumos HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan CSS - FONT di HTML</title>
<style type="text/css">
#p{
color: #ff00ff;
font-size: 20px;
font-weight: bold;
font-family:Rockwell, Calibri, Monospace;
font-style : oblique; }
#p1{
color:#0000FF;
font-size: 1em;
font-weight: normal;
font-variant: small-caps;
font-family: Andale Mono;}
</style>
</head>
<body>
<p id="p">Contoh penggunaan CSS untuk mengatur font style pada suatu teks di HTML</p>
<p id="p1">Contoh Berikutnya Ini</h5>
</body>
</html>Rezultāts izskatīsies šādi:
Kad esat redzējis CSS kodu un attēlutas izskatās pārlūkprogrammā, protams, jums ir daudz jautājumu par to, kādi ir fonta rekvizīti iepriekš minētajā kodā. Šeit es sniedzu nelielu skaidrojumu pa vienam (bet atcerieties, ka mēs vispirms koncentrējamies tikai uz HTML, nevis uz CSS):
A. CSS fonta lielums
Fonta lielums tiek izmantots, lai noteiktuparādāmā teksta rakstzīme. Tātad, katram HTML dokumenta tekstam varat izmantot atšķirīgus fontu izmērus. Lai noteiktu fonta lielumu, piemēram, iepriekšējā koda piemērā, varat izmantot pikseļu, em vai% vienības:
#p{ font-size: 20px; }
#p1{ font-size: 1em; }Ļoti ieteicams izmantot em vienībasnevis pikseļu, kur 1em ir 16 pikseļi. Bet, ja jums ir ērtāk izmantot pikseļus, tā arī nav problēma. Piemērā # p1 {fonta lielums: 1em; }, pikseļa vērtība ir 16 pikseļi, jo 16 pikseļi / 16 = 1em.
B. CSS fontu saime
Fontu saimi izmanto, lai noteiktu fonta veidu, kas tiek piemērots HTML dokumentiem. Kā piemēru apskatīsim fontu saimes izmantošanas piemēru iepriekšējā kodā, kas ir:
#p{ font-family:Rockwell, Calibri, Monospace;}
#p1{ font-family: Andale Mono;}#P ir trīs fontu tipi, proti, Rockwell,Calibri un Monospace. Kas nozīmē, ka vispirms tiks piemērots fonta tips Rockwell. Bet, ja Rockwell fonta tips lietotāja datorā nav pieejams, piemērotais fonta tips kļūst par Calibri. Pēc tam, ja tas nav pieejams, izmantojiet Monospace, kas ir noklusējuma fonts.
C. CSS fonta svars
Fonta svars tiek izmantots drukāta treknraksta drukāšanai. Šeit ir piemērs kodā
iepriekšējā:
#p{ font-weight: bold;}
#p1{ font-weight: normal};D. CSS fonta stils
Fonta stilu izmanto, lai padarītu paņēmienu slīprakstā, kur var izmantot 3 vērtības, proti, parasto, slīprakstu un slīpo. Šis ir fonta stila izmantošanas piemērs:
#p{ font-style : oblique;} // Teks ditampilkan berbentuk condong
#p1{ font-style : normal;} // Teks ditampilkan biasa tanpa style
#p2(font-style : italic;} // Teks ditampilkan dalam huruf miringE. CSS fonta variants
Varianti tiek izmantoti, lai drukātu tekstu ar lielajiem burtiem. Šeit ir tās izmantošanas piemērs:
#p{ font-variant: normal;} // Teks normal
#p1{ font-variant: small-caps ;} // Teks ditampilkan dalam huruf kapital semuaIzlasot iepriekš minēto rakstu, es ceru, ka jūsvar mainīt krāsu un fonta veidu jūsu HTML dokumentā. Nākamā HTML apmācība ir par pēdiņu izveidi HTML, izmantojot tagus q un blockquote.
