Pozdrav, prijatelji.
Nakon još jedne duge pauze, sjetio sam se da dugo nisam napisao ni jedan red. Naravno, postoje razlozi za to, jer uvijek će se naći neki razlog da se nađe neki izgovor, zar ne? Zapravo, svaki dan radim Video Kurs, koji sam već par puta spomenuo, ali za sada neću ništa više o tome, sve ćete saznati uskoro.
Dakle, pošto mi ništa nije palo na pamet da pišem. Odlučio sam da pogledam statistiku, šta zanima korisnike RuNeta u vezi sa HTML-om, WordPress-om, DLE-om itd. slične teme. I pogodi šta? Ima još o čemu da se piše. Čini se da sva pitanja koja sam pronašao imaju odgovore, ali ne uvijek u razumljivom obliku. I općenito je postalo zanimljivo napisati tako nešto.
Danas ćemo pričati o HTML-u. Naime, govorit ćemo o tome kako tekst istaknuti podebljanim i kurzivom, a govorit ćemo i o isticanje bojom.
Podebljavanje teksta.
Da biste podebljali tekst, ne morate raditi ništa otmjeno sa CSS stilovima ili smišljati bilo koje druge komplikacije. HTML već ima ovu funkciju. U isto vrijeme, ne možemo samo istaknuti tekst podebljanim, već i staviti naglasak na njega korištenjem isticanja. Naglasak može biti na tražilice ili bilo koji specijalni pretraživači ili programe. Najvažnije je ne pretjerivati sa isticanjem teksta u članku ili na stranici sa nekim informacijama, jer to može imati štetan učinak, barem na promociju ove HTML stranice.
Dakle, da jednostavno podebljamo tekst, možemo koristiti oznaku . Ova oznaka odnosi se na elemente fizičkog označavanja, dok je tekst podebljan bez stavljanja naglaska na njega. Ova oznaka je uparena oznaka, što znači da ima i oznaku za otvaranje i za zatvaranje. Dodatno, pošto je element inline, mora biti u nekom blok elementu, na primjer
Primjer koda:
sličica
rezultat:
sličica
U ovom slučaju, jednostavno smo podebljali tekst i to je to.
Ali to se dešava, tako da ne trebamo samo da istaknemo tekst, već da se fokusiramo na njega. Za ovo možemo koristiti logičku markup tag . Ne samo da tekst označen ovom oznakom ima veću težinu za pretraživače. Ali u teoriji bi trebalo da se razlikuje od oznake u pretraživačima govora, na primjer po intonaciji. Međutim, ne mogu ni potvrditi ni demantovati ove informacije, je li tako?
U ovom slučaju, sve je apsolutno isto kao u slučaju sa jednostavan izbor podebljano, samo mi pravimo naglasak, a ne samo isticanje.
Primjer koda:
rezultat:
Sve je prilično jednostavno, zar ne?
Kurzivite tekst.
U ovom slučaju sve nije komplikovanije nego u prvom. I naša situacija je potpuno ista. Tekst možemo istaknuti sa dvije opcije u HTML-u. Opet, koristeći ili fizičku oznaku za označavanje ili logičku oznaku, s kojom se ponovo fokusiramo na odabrani tekst.
Da bismo tekst napravili kurzivom, koristićemo tag . Ovaj element je uparen i ugrađen, što nam govori da trebamo koristiti i oznaku za otvaranje i za zatvaranje. Također bi ga trebali koristiti unutar blok elementa. I unutra u ovom slučaju najbolji blok element je oznaka paragrafa
Primjer koda:
tekst u kurzivu
rezultat:
tekst u kurzivu
I naravno, možemo istovremeno naglasiti tekst tako što ćemo ga istaći kurzivom pomoću oznake . Ova stavka kao što su , osim što je tekst kurziv i nije podebljan.
Primjer koda:
tekst na koji smo se fokusirali
rezultat:
tekst na koji smo se fokusirali
I poslednja stvar o kojoj bih danas želeo da pričam je isticanje teksta bojom.
Nažalost, nemamo oznaku za isticanje teksta bojom u HTML-u. Ali ipak, u ovoj metodi nema ništa komplicirano.
Dakle, da istaknem određeni dio boju teksta, možemo premotati željeni dio teksta oznakom , koji je generička oznaka i koristi se unutar blok elementa. U našem slučaju blok element je oznaka Ali dodaj nije dovoljno. Također morate navesti parametar stila koji će vam omogućiti dodavanje CSS svojstva traženi tekst, navedite samu osobinu (boju), koja će pomoći u postavljanju određene boje. Na kraju, navedite vrijednost za svojstva boje. Ali može se postaviti pitanje: "Šta da naznačim?" Potrebno je da navedete HTML kod boje u koju želimo da "obojimo" tekst. HTML kodovi boja se mogu pronaći. Sada, da bude jasnije, pogledajmo primjer. Primjer koda.
tekst za isticanje boja
U ovom slučaju ističemo jednu riječ: bojom. Također želim napomenuti da je oznaka je uparen i moramo ga zatvoriti tamo gdje bi svojstvo trebalo završiti.
rezultat:
tekst koji treba istaknuti
Na ove jednostavne načine možemo manipulirati tekstom na našoj stranici. Takođe bih želeo da napomenem da sve o čemu smo upravo pričali radi i na WordPress-u i na DLE-u, pošto svaki motor koristi HTML za prikaz stranica. Zato se HTML može nazvati osnovom bilo koje web stranice, bez obzira koji CMS imate.
Nadam se da sam sve jasno objasnio.
Sretno, prijatelji. Uskoro... bit će zanimljivih vijesti...
Danas ću vam reći kako se prave riječi podebljano na web stranici sa koristeći HTML i CSS. Ovaj dizajn se koristi kada trebate istaknuti određene informacije Na stranici. Štaviše mi pričamo o tome ne samo o naslovima, već i o jednostavnim riječima, fraze u tekstu. Ovo se implementira prilično jednostavno.
Za označavanje određenog teksta podebljanim, koriste se posebne HTML oznake - I . Na primjer sljedeći kod:
|
Thumbnail. Podebljani tekst jak. |
Običan tekst.
Thumbnail.
Podebljani tekst jak.
Izlaz daje sljedeću sliku:
Posljednje dvije opcije vizualno izgledaju isto, ali se malo razlikuju jedna od druge. Tag specificira jednostavno stilsko isticanje riječi podebljanim slovima, dok Istovremeno, dodaje određeno semantičko „pojačano“ (važno) značenje. Odnosno, posljednji red nije samo podebljan tekst, već neke važne informacije. U principu, za pretraživače se preporučuje korištenje .
Također možete vidjeti podebljani font napisan u HTML koristeći stilove:
Primjer podebljanog teksta.
Primjer teksta sa bold jednom riječju.
Na web stranici se prikazuje ovako:
Iako podebljani tekstualni kod za HTML radi ispravno, to ne bi trebalo raditi na ovaj način. Svi stilovi dizajna moraju biti uključeni CSS fajl. Dakle, u gornjem primjeru morali ste za oznake
I navedite odgovarajuću klasu, a zatim navedite njen dizajn u listi stilova. Ovo su pravila oblikovanja koda. Dakle, za podebljani font u HTML-u koristite oznaku .
Podebljani tekst u CSS-u
Da biste napravili podebljani font u CSS-u, koristite svojstvo font-weight. Koristi se za označavanje "zasićenosti" fragmenta teksta. Vrijednosti se mogu kretati od 100 do 900, ali najčešće korištene su:
- podebljano - 700 po defaultu;
- normalno - 400 po defaultu.
Postoje i opcije za podebljane i svjetlije vrijednosti, koje mijenjaju font ovisno o roditelju tako da bude više ili manje podebljan.
Da biste postavili podebljani tekst u CSS-u, morate postaviti neki stil za ovaj ili onaj element, na primjer:
Običan tekst sa podebljano isticanje u centru.
jak (težina fonta: bold; )
Ovdje bih želio napomenuti jednu malu nijansu o kojoj mi je rečeno - ako kreirate za neki element nova klasa, tada je preporučljivo koristiti manje-više „razumljivo ime“. Na primjer, u gornjem primjeru stil class="my-bold-font" izgleda logičnije od class="new-font", jer može se delimično razumeti njegova svrha. Ovo je plus za one koji će gledati i koristiti vaš izgled u budućnosti.
U sljedećem članku ću vam reći o zanimljivim podebljanim fontovima koje sam uspio pronaći.
Zasićenje je povećanje debljine linija fonta i, shodno tome, kontrasta. Obično postoje četiri vrste težine: lagana, normalna, bold i bold. Međutim, pomoću HTML-a možete postaviti samo normalne i podebljane stilove. Za postavljanje podebljanog teksta koriste se dvije oznake: I .
Podebljani stil fonta Snažno isticanje teksta
Kurziv stil
Kurzivni font nije samo kosi pojedinačni likovi, za neke fontove ovo je potpuna prerada novi stil, imitirajući rukopis. Kurziv za tekst određuju dvije oznake: I .
Kurziv stil fonta Odabir teksta
Treba napomenuti da oznake I , kao i I iako slični po svom dejstvu, nisu u potpunosti ekvivalentni i zamenljivi. Prva oznaka - je fizička oznaka za označavanje i postavlja podebljani stil teksta i tag - sa logičkom oznakom za označavanje i ističe označeni tekst. Ovo razdvajanje oznaka na logičko i fizičko formatiranje prvobitno je trebalo da se napravi HTML univerzalan, uključujući one neovisne o uređaju za izlaz informacija. Teoretski, ako koristite, na primjer, preglednik govora, onda tekst formatiran pomoću oznaka I , bit će označeni drugačije. Međutim, pokazalo se da u popularni pretraživači rezultat korištenja ovih oznaka je ekvivalentan.
Primjer 7.5 pokazuje upotrebu oznaka I za formatiranje tekstova.
Primjer 7.5. Oznake I
Gdje su kolačići i mjesečina?! - uzviknuo je Zločesti dečko.
Rezultat ovaj primjer prikazano na sl. 7.5.
27.11.14. 88.7KVeličina fonta je bitna u html-u važnu ulogu. Omogućava vam da skrenete pažnju korisnika važna informacija, objavljeno na stranici stranice. Iako nije važna samo veličina slova, već i njihova boja, debljina, pa čak i porodica.
Oznake i atributi pri radu sa html fontovima
Jezik hiperteksta ima širok spektar alata za rad sa fontovima. Uostalom, formatiranje teksta je glavni zadatak html-a.
Razlog za stvaranje HTML jezik Došlo je do problema s pretraživačima koji prikazuju pravila oblikovanja teksta.
Pogledajmo oznake koje se koriste za rad sa fontovima u HTML-u i njihove atribute. Glavna je oznaka . Koristeći vrijednosti njegovih atributa, možete postaviti nekoliko karakteristika fonta:
- boja – postavlja boju teksta;
- veličina – veličina fonta u konvencionalnim jedinicama.
Podržane su pozitivne vrijednosti atributa od 1 do 7.
- lice – koristi se za postavljanje porodice fontova teksta koji će se koristiti unutar oznake . Podržano je nekoliko vrijednosti, odvojenih zarezima.
Formatira se samo tekst koji se nalazi između dijelova tag par font. Ostatak teksta je prikazan standardni font, instaliran prema zadanim postavkama.
Također u html-u postoji veliki broj uparenih oznaka koje specificiraju samo jedno pravilo formatiranja. To uključuje:
- — postavlja podebljani font u html-u. Tag slično djelovanju prethodnom;
- — veličina je veća od zadane;
- — manja veličina font;
- — kurziv tekst(kurziv). Slična oznaka ;
- — tekst sa podvlačenjem;
- precrtano;- - prikaz teksta samo u mala slova;
- - velikim slovima.
Običan tekst
Thumbnail
Thumbnail
Više nego inače
Manje nego inače
Kurziv
Kurziv
Sa donjom crtom
Precrtano
Mogućnosti stilskih atributa
Osim opisanih oznaka, postoji još nekoliko načina za promjenu fonta u html-u. Jedan od njih je korištenje atributa generičkog stila. Koristeći vrijednosti njegovih svojstava, možete postaviti stil prikaza fontova:
1) font-family – svojstvo postavlja porodicu fontova. Moguće je navesti više vrijednosti.
Promjena fonta u html-u na sljedeću vrijednost će se dogoditi ako prethodna porodica nije postavljena na operativni sistem korisnik.
Sintaksa pisanja:
font-family: font-name [, font-name[, ...]]
2) font-size – veličina je postavljena od 1 do 7. Ovo je jedan od glavnih načina na koji možete povećati font u HTML-u.
Sintaksa pisanja:
font-size: apsolutna veličina | relativna veličina | značenje | interes | nasljediti
Također možete postaviti veličinu fonta:
- U pikselima;
- U apsolutnom smislu ( xx-mali, x-mali, mali, srednji, veliki);
- U procentima;
- U bodovima (pt).
Veličina fonta:7
Veličina fonta: 24px
Veličina fonta: x-large
Veličina fonta: 200%
Veličina fonta: 24pt
3) font-style – postavlja stil pisanja fonta. sintaksa:
stil fonta: normalan | kurziv | koso | nasljediti
vrijednosti:
- normalan – normalan pravopis;
- kurziv – kurziv;
- koso – font nagnut udesno;
- naslijediti – nasljeđuje pravopis nadređenog elementa.
Primjer kako promijeniti font u html-u koristeći ovo svojstvo:
font-style:inherit
font-style:italic
font-style:normal
font-style: oblique
4) font-varijanta – prevodi sve velika slova u glavnim gradovima. sintaksa:
font-varijanta: normalna | mala slova | nasljediti
Primjer kako promijeniti font u html-u sa ovim svojstvom:
font-variant:inherit
font-variant:normal
font-variant:small-caps
5) font-weight – omogućava vam da podesite debljinu teksta (zasićenost). sintaksa:
font-weight: bold|bolder|lighter|normal|100|200|300|400|500|600|700|800|900
vrijednosti:
- bold – postavlja html font na bold;
- podebljano – podebljanije u odnosu na normalno;
- lakši – manje zasićen u odnosu na normalan;
- normalan – normalan pravopis;
- 100-900 – postavlja debljinu fonta u numeričkom ekvivalentu.
font-weight:bold
font-weight:bolder
font-weight:lighter
font-weight:normal
font-weight:900
font-weight:100
html svojstvo fonta i boja fonta
Font je još jedno svojstvo kontejnera. U sebi je kombinirao vrijednosti nekoliko svojstava namijenjenih za promjenu fontova. sintaksa fonta:
font: font-size font-family | nasljediti
Također, vrijednost se može postaviti na fontove koje sistem koristi u natpisima na razni elementi kontrole:
- natpis – za dugmad;
- ikona – za ikone;
- meni - meni;
- message-box – za dijaloške okvire;
- small-caption – za male kontrole;
- status-bar – font statusne trake.
font:icon
font:caption
font:meni
font:message-box
mali natpis
font: statusna traka
font:italic 50px bold "Times New Roman", Times, serif
Postoje tri načina da se tekst podeblja HTML stranica, ali nemojte žuriti da odmah koristite onaj koji vam se sviđa, jer takav odabir može imati različita značenja i utjecati na optimizaciju stranice za tražilicu.
Podebljani font sa jakom oznakom
Ova metoda je prikladna ako želite istaknuti važan dio teksta podebljanim slovima. HTML oznaka je oznaka logičko formatiranje i njegova suština: „naglasiti“ važnost odabranog fragmenta.
Postoje i druge oznake logičkog oblikovanja u HTML-u. Na primjer, oznaka čini tekst kurzivom i ukazuje na naglasak na istaknutoj frazi.
Ostale vrste odabira teksta opisane su u članku:.
Običan tekst istaknuti važan dio teksta. Običan tekst.
Podebljani tekst pomoću oznake b
Običan tekst tekst podebljan. Običan tekst.
Podebljani CSS stilovi
Podebljani tekst se može napraviti ne samo pomoću poseban HTML oznake Možete postići podebljani izlaz na bilo kojoj oznaci tako što ćete joj postaviti svojstvo font-weight: bold;. (ne radi za sve fontove).
Takvo isticanje će biti stilske prirode, bez dodavanja logičke težine odabranom tekstu.
Osim toga, možete odabrati ili određenu oznaku ili grupu elemenata odjednom postavljanjem stilova putem CSS klase.
CSS svojstvo unutar atributa style:
Tekst podebljan.
Tekst podebljan.
Tekst u normalnom fontu.
Tekst podebljan.
Šta učiniti ako ne možete podebljati tekst?
Ako ne možete da podebljate tekst, vjerovatno je da su CSS stilovi elemenata zamijenjeni na vašoj web lokaciji. U ovom slučaju, morat ćete prilagoditi ove stilove. U većini slučajeva to će biti učinjeno kroz datoteku glavnih tabela CSS stilovi. Ako ovo ne razumijete, kontaktirajte webmastera. Najvjerovatnije, rješavanje ovog problema neće zahtijevati više od 5 minuta rada (iako, naravno, može biti izuzetaka).
