Pozdrav Prijatelji.
Nakon još jedne duge pauze sjetio sam se da dugo nisam napisao niti jedan redak. Naravno, postoje razlozi za to, jer uvijek postoji neki razlog da smislite izgovor za sebe, zar ne? Zapravo, svaki dan učim Video tečaj, koji sam već par puta spomenuo, ali za sada neću ništa više o ovome, uskoro ćete sve saznati.
Pa, pošto mi ništa nije palo na pamet, o čemu da pišem. Odlučio sam pogledati statistiku, što zanima korisnike Runeta o HTML-u, WordPressu, DLE-u i tako dalje slične teme... I znaš što? Ima još o čemu pisati. Čini se da postoje odgovori na sva pitanja koja sam pronašao, ali ne uvijek u razumljivom obliku. I općenito je postalo zanimljivo napisati tako nešto.
Danas ćemo govoriti o HTML-u. Naime, kako podebljati tekst i kurzivom, a također pričati o isticanje bojom.
Podebljajte tekst.
Da biste podebljali tekst, ne morate se petljati s CSS stilovima ili smišljati bilo kakve druge složenosti. HTML već ima tu mogućnost. Istodobno, ne samo da možemo podebljati tekst, već i staviti naglasak na njega uz pomoć odabira. Naglasak se može staviti na tražilice ili bilo koje posebne preglednike ili programe. Glavna stvar je ne pretjerivati s naglašavanjem teksta u članku ili na stranici s nekim informacijama, jer to može imati štetan učinak barem na promociju ove HTML stranice.
Dakle, da bismo samo podebljali tekst, možemo koristiti oznaku . Ova oznaka odnosi se na elemente fizičkog označavanja, dok je tekst podebljan bez ikakvog naglaska na njemu. Ova oznaka je uparena, što znači da ima i početnu i završnu oznaku. Također, budući da je element inline, mora biti u nekoj vrsti blok elementa, na primjer
Primjer koda:
sličica
Proizlaziti:
sličica
U ovom slučaju, samo smo podebljali tekst i to je to.
Ali događa se, tako da ne trebamo samo istaknuti tekst, već ga i naglasiti. Za to možemo koristiti booleovu oznaku za označavanje ... Ne samo da tekst označen ovom oznakom ima veću težinu za tražilice. Ali u teoriji, trebao bi se razlikovati od oznake u preglednicima govora, na primjer intonacija. Međutim, ne mogu ni potvrditi ni demantirati ova informacija, Je li tako?
U ovom slučaju, sve je apsolutno isto kao u slučaju s jednostavan odabir podebljano, samo se mi fokusiramo, a ne samo ističemo.
Primjer koda:
Proizlaziti:
Prilično je jednostavno, zar ne?
Kurziv tekst.
U ovom slučaju sve nije kompliciranije nego u prvom. A naša situacija je apsolutno ista. Tekst možemo istaknuti s dvije opcije u HTML-u. Opet, koristeći ili fizičku oznaku za označavanje ili logičku oznaku, s kojom se ponovno fokusiramo na odabrani tekst.
Da bismo tekst učinili kurzivom, koristit ćemo oznaku ... Ovaj element je uparen i umetnut, što nam govori što bismo trebali koristiti, i početnu i završnu oznaku. I također ga morate koristiti unutar blok elementa. I u u ovom slučaju najbolje usklađeni blok element - oznaka paragrafa
Primjer koda:
kurziv tekst
Proizlaziti:
kurziv tekst
I naravno, možemo istovremeno naglasiti tekst tako da ga označimo kurzivom pomoću oznake . Ova stavka kao npr , osim što je tekst kurziv, a ne podebljan.
Primjer koda:
tekst na koji smo naglasili
Proizlaziti:
tekst na koji smo naglasili
I posljednje o čemu bih danas želio govoriti je isticanje teksta bojom.
Nažalost, nemamo oznaku za isticanje teksta bojom u HTML-u. Ali ipak, u ovoj metodi nema ništa teško.
Dakle da istaknem određeni dio tekst u boji, željeni dio teksta možemo premotati oznakom , što je generička oznaka i koristi se unutar elementa bloka. U našem slučaju blok element je oznaka Ali dodaj nedovoljno. Također morate odrediti parametar stila koji će vam omogućiti dodavanje CSS svojstva potreban tekst, navedite samo svojstvo (boju), što će vam pomoći da postavite određenu boju. Konačno, navedite vrijednost za svojstva boje... Ali može se postaviti pitanje: "Što da naznačim?" Potrebno je navesti HTML-kod boje u koju želimo "obojiti" tekst. HTML kodovi boja mogu se pronaći. Sada, da bude jasnije, razmotrite 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 na mjestu gdje bi svojstvo trebalo završiti.
Proizlaziti:
tekst koji treba istaknuti
Na tako jednostavne načine možemo manipulirati tekstom na našoj stranici. Također bih želio napomenuti da sve o čemu smo upravo pričali radi i na WordPressu i na DLE-u, jer svaki motor koristi HTML za renderiranje stranica. Zato se HTML može nazvati osnovom temelja svake 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 napraviti riječi podebljano na mjestu sa koristeći HTML i CSS. Ovaj dizajn se koristi kada trebate istaknuti određene informacije Na stranici. I dolazi ne samo o zaglavljima, već i o jednostavne riječi, fraze u tekstu. Ovo se provodi vrlo jednostavno.
Za isticanje određenog teksta podebljanim, koriste se posebne HTML oznake - i ... Na primjer sljedeći kod:
|
Sličica. Snažan podebljan tekst. |
Običan tekst.
Sličica.
Snažan podebljan tekst.
Izlaz daje sljedeću sliku:
Posljednje dvije opcije vizualno izgledaju isto, ali se malo razlikuju jedna od druge. Označiti specificira jednostavnu stilsku smjelost riječi, dok dodaje određeno semantičko "pojačano" (važno) značenje. Odnosno, zadnji redak nije samo podebljani tekst, već neke važne informacije. U principu, za tražilice se preporuča koristiti točno .
Također možete naići na podebljani tekst u HTML-u sa stilovima:
Primjer podebljanog teksta.
Primjer teksta sa podebljano riječ.
Stranica to prikazuje ovako:
Iako podebljani HTML kod radi ispravno, ne bi trebao. Svi stilovi dizajna trebaju biti prikazani CSS datoteka... Stoga ste u gornjem primjeru morali za oznake
I navedite odgovarajuću klasu, a zatim upišite njezin izgled u tablicu stilova. Ovo su pravila za kodiranje. Dakle, za podebljanje u HTML-u upotrijebite oznaku .
Podebljani CSS tekst
Da bi CSS bio podebljan, koristi se svojstvo font-weight. Uz njegovu pomoć, naznačena je "zasićenost" fragmenta teksta. Vrijednosti se mogu kretati od 100 do 900, ali najčešće korištene su:
- podebljano (podebljano) - 700 prema zadanim postavkama;
- normalno - 400 prema zadanim postavkama.
Postoje i opcije za podebljane i svjetlije vrijednosti, koje mijenjaju font ovisno o roditelju u 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 masni iscjedak u središtu.
jak (težina fonta: bold;)
Ovdje bih želio napomenuti jednu malu nijansu o kojoj mi je rečeno - ako kreirate za neki element novi razred, tada je poželjno koristiti više-manje „razumljiv naziv“. Na primjer, u gornjem primjeru stil class = "my-bold-font" izgleda logičnije od class = "new-font", jer možete djelomično razumjeti njegovu svrhu. Ovo je plus za one koji će u budućnosti gledati i koristiti vaš izgled.
U sljedećem članku ću vam reći o nekim zanimljivim podebljanim fontovima koje sam uspio pronaći.
Zasićenje je povećanje debljine linija fonta i, sukladno tome, kontrasta. Obično postoje četiri vrste zasićenja: svijetlo, normalno, podebljano i podebljano. Međutim, samo normalni i podebljani stil mogu se postaviti s HTML-om. Za postavljanje podebljanog teksta koriste se dvije oznake: i .
Podebljano pismo Snažan odabir teksta
Kurziv stil
Kurziv nije samo kos pojedinačni likovi, za neke fontove ovo je potpuna prerada novi stil oponašajući rukopisno. Dvije oznake definiraju kurziv za tekst: i .
Kurziv stil fonta Odabir teksta
Valja napomenuti da oznake i , kao i i iako slični u djelovanju, nisu u potpunosti jednaki i zamjenjivi. Prva oznaka - je fizička oznaka za označavanje i postavlja podebljani tekst i oznaku - logička oznaka za označavanje i ističe označeni tekst. Ovo razdvajanje oznaka na logičko i fizičko oblikovanje izvorno je bilo namijenjeno izradi HTML svestran, uključujući one koji ne ovise o uređaju za izlaz informacija. Teoretski, ako koristite, na primjer, preglednik govora, tada je tekst formatiran pomoću oznaka i , bit će označeni drugačije. Međutim, pokazalo se da u popularni preglednici rezultat korištenja ovih oznaka je jednak.
Primjer 7.5 pokazuje korištenje oznaka i za dizajn tekstova.
Primjer 7.5. Oznake i
A gdje su kolačići i mjesečina ?! - uzviknuo je zločesti dječak.
Proizlaziti ovaj primjer prikazano na sl. 7.5.
27.11.14. 88,7KU html-u se igra veličina fonta važna uloga... Omogućuje vam da privučete pozornost korisnika važna informacija objavljeno na stranici web stranice. Iako nije važna samo veličina slova, već i njihova boja, debljina, pa čak i obitelj.
Oznake i atributi prilikom indeksiranja s html fontovima
Jezik hiperteksta ima veliki skup alata za rad s fontovima. Uostalom, upravo je oblikovanje teksta glavni zadatak html-a.
Razlog za stvaranje HTML jezik postao problem prikazivanja pravila oblikovanja teksta od strane preglednika.
Razmotrite oznake koje se koriste za rad s 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;
- size - veličina fonta u konvencionalnim jedinicama.
Podržane su pozitivne vrijednosti atributa od 1 do 7.
- lice - koristi se za postavljanje obitelji fontova teksta koji će se koristiti unutar oznake ... Nekoliko vrijednosti je podržano odjednom, odvojeno zarezima.
Formatira se samo tekst između dijelova. uparena oznaka font. Prikazuje se ostatak teksta standardni font instaliran prema zadanim postavkama.
Također u html-u postoji niz uparenih oznaka koje specificiraju samo jedno pravilo oblikovanja. To uključuje:
- - postavlja podebljani font u html-u. Označiti radnja je slična prethodnoj;
- - veličina je veća od zadane;
- — manja veličina font;
- — kurziv tekst(kurziv). Slična oznaka ;
- - podvučeni tekst;
- prekrižen;- - prikaz teksta samo u mala slova;
- - velikim slovima.
Običan tekst
Sličica
Sličica
Više nego inače
Manje nego inače
Kurziv
Kurziv
Podvučeno
Prekrižen
Mogućnosti atributa stila
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 fonta:
1) font-family - svojstvo postavlja obitelj fontova. Moguće je nabrajanje nekoliko vrijednosti.
Promjena fonta u html-u na sljedeću vrijednost dogodit će se ako prethodna obitelj nije postavljena na operacijski sustav korisnik.
Sintaksa pisanja:
font-family: naziv fonta [, naziv fonta [, ...]]
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:
veličina fonta: apsolutna veličina | relativna veličina | vrijednost | kamata | naslijediti
Veličina fonta također se može postaviti:
- U pikselima;
- U apsolutnoj vrijednosti ( xx-mali, x-mali, mali, srednji, veliki);
- U postocima;
- 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 | naslijediti
vrijednosti:
- normalan - normalan pravopis;
- kurziv - kurziv
- kosi - desno nagnut font;
- naslijediti - nasljeđuje pravopis nadređenog elementa.
Primjer kako promijeniti font u html-u pomoću ovog svojstva:
font-style: naslijediti
stil fonta: kurziv
stil fonta: normalan
stil fonta: kosi
4) font-varijanta - prevodi sve velika slova velikim slovima. Sintaksa:
varijanta fonta: normalna | mala slova | naslijediti
Primjer kako promijeniti font u html-u s ovim svojstvom:
font-varijanta: naslijediti
font-varijanta: normalan
varijanta fonta: mala slova
5) font-weight - omogućuje postavljanje debljine pisanja teksta (zasićenost). Sintaksa:
težina fonta: podebljano | podebljano | svjetlije | normalno | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
vrijednosti:
- bold - postavlja html podebljani font;
- hrabriji - deblji u odnosu na normalno;
- lakši - manje zasićen u odnosu na normalu;
- normalan - normalan pravopis;
- 100-900 - postavlja debljinu fonta u numeričkom ekvivalentu.
font-weight: bold
font-weight: podebljano
font-weight: lakši
font-weight: normalan
težina fonta: 900
težina fonta: 100
Svojstvo fonta i boja html fonta
Font je još jedno svojstvo spremnika. Interno je kombinirao vrijednosti nekoliko svojstava dizajniranih za promjenu fontova. Sintaksa fonta je:
font: font-size font-family | naslijediti
Također, vrijednost se može postaviti na fontove koje sustav koristi u natpisima na raznih elemenata upravljanje:
- natpis - za gumbe;
- ikona - za ikone;
- jelovnik - jelovnik;
- message-box - za dijaloške okvire;
- small-caption - za male kontrole
- statusna traka - font statusne trake.
font: ikona
font: natpis
font: izbornik
font: okvir za poruke
mali natpis
font: statusna traka
font: kurziv 50px bold "Times New Roman", Times, serif
Postoje tri načina da se tekst podeblja HTML stranica, ali nemojte žuriti odmah upotrijebiti bilo koji koji vam se sviđa, jer takav odabir može imati različita značenja i utjecati na optimizaciju stranice za tražilicu.
Podebljano s jakom oznakom
Ova je metoda prikladna ako želite istaknuti važan dio teksta podebljanim slovima. HTML oznaka je oznaka logičko oblikovanje a njegova bit: "naglasiti" važnost istaknutog fragmenta.
U HTML-u postoje i druge booleove oznake za formatiranje. Na primjer, oznaka čini tekst kurzivom i označava 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 podebljan tekst... Običan tekst.
Podebljani CSS
Podebljani tekst može se raditi ne samo sa poseban HTML oznake. Ispis možete postići podebljanim na bilo kojoj oznaci postavljanjem svojstva font-weight na nju: bold; (ne radi za sve fontove).
Takav odabir bit će stilske prirode, bez dodavanja logičke težine odabranom tekstu.
Osim toga, možete odabrati ili određenu oznaku ili grupu elemenata odjednom navođenjem stilova kroz CSS klasu.
CSS svojstvo unutar atributa stila:
Podebljan tekst.
Podebljan tekst.
Tekst je u uobičajenom fontu.
Podebljan tekst.
Što učiniti ako ne možete podebljati tekst
Ako ne možete podebljati tekst, najvjerojatnije je vaša stranica nadjačala stilove CSS elemenata. U ovom slučaju, morat ćete prilagoditi ove stilove. U većini slučajeva to se može učiniti putem datoteke glavne tablice CSS stilovi... Ako ovo ne razumijete, obratite se webmasteru. Najvjerojatnije će rješavanje ovog problema trajati ne više od 5 minuta rada (iako, naravno, mogu postojati iznimke).
