Cum să măriți dimensiunea fontului în tabelul html
Dimensiunile mesei, înălțimea și lățimea acestuia, sunt determinate automat în funcție de ceea ce conțin celulele în interior. Cu cât celulele se umple mai mult, cu atât dimensiuni mai mari tabele și invers.
Cu toate acestea Caracteristici CSS vă permit să redimensionați un tabel în HTML, specificând exact lățimea și înălțimea de care aveți nevoie. Pentru a fi corect, trebuie remarcat faptul că atributele tabelului vă permit, de asemenea, să setați dimensiunile cerute. Cu toate acestea, în momentul prezent vom vorbi doar despre CSS.
Trebuie subliniat faptul că fiecare tabel are propria lățime minimă și înălțimea minimă, care sunt afectate de conținutul său. Și chiar dacă setați valorile de lățime și înălțime și mai mici, nu se va întâmpla nimic. Laturile mesei nu vor depăși minimul lor.
Pentru a specifica lățimea tabelului, trebuie să utilizați o proprietate CSS lăţime, iar pentru a seta înălțimea trebuie să utilizați proprietatea înălţime.
Într-un exemplu arată așa.
Tabel ( lățime: 500px; înălțime: 100px; )
Rezultat în browser:
Cod complet:
| 1 | 2 | 3 | 4 | 5 |
|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 |
| 1 | 2 | 3 | 4 | 5 |
Valorile pentru lățimea și înălțimea tabelului pot fi specificate ca valoare absolută(în pixeli) și relativă - în procente. De exemplu, 20px și, respectiv, 20%.
Dacă utilizați procente pentru a seta dimensiunile tabelului, acestea vor fi calculate pe baza dimensiunilor element părinte. Dacă vorbim despre exemplul nostru, atunci despre care vorbim despre fereastra browserului.
Există un alt sens - auto. Și este special pentru că cu ajutorul lui, lățimea și înălțimea mesei sunt calculate automat, implicit. În practică, specificarea acestei valori arată astfel.
Latime: automat;
Înălțime: auto;
Dorim să vă atragem atenția asupra încă un lucru: punct important. Este mai bine să nu indicați înălțimea ca procent, deoarece, de regulă, în acest caz nu vor funcționa.
Specificarea dimensiunilor celulelor și coloanelor individuale
Dacă credeți că browserul nu a setat corect lățimea coloanelor pe baza conținutului celulelor, atunci aveți dreptul să specificați singur dimensiunile celulelor și coloanelor. Și acum vom vorbi despre cum să schimbați dimensiunea celulei într-un tabel HTML.
Redimensionarea celulelor se face folosind aceleași proprietăți CSS ca și dimensiunile tabelelor, și anume: lăţimeŞi înălţime.
Pentru a adăuga stiluri la celule, puteți utiliza una dintre cele două opțiuni:
- Dați celulelor nume individuale de clasă. Va arăta astfel: class="cell-50px"
Și după aceea ar trebui să aplicați stiluri pentru aceste clase.
- Activați atributul stil, în interiorul căruia scrieți codul CSS necesar.
În practică, a doua opțiune va arăta astfel:
Cu toate acestea, am dori să remarcăm că nu este necesar să se schimbe foarte des dimensiunile celulelor individual. De regulă, acest lucru se face în situațiile în care este necesar să setați o anumită lățime pentru coloanele tabelului. În acest caz, problema se rezolvă mai ușor. Trebuie doar să specificați lățimea celulelor din primul rând.
| 1 | 2 | 3 | 4 | 5 |
|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 |
| 1 | 2 | 3 | 4 | 5 |
Rezultat în browser: 
Cum se schimbă dimensiunea fontului într-un tabel
Adesea este nevoie să schimbați dimensiunea textului dintr-un tabel. De exemplu, în celulele antet. Acest lucru se poate face folosind o proprietate CSS dimensiunea fontului. Să setăm dimensiunea fontului pentru elemente
Th (dimensiunea fontului: 30px; )
Pe aceasta această lecție se termină. Vă sugerez să vă gândiți bine la temele dvs. Doar studiază-l cu atenție și gândește-te. Toate cele bune tuturor!
După cum știm deja, tabelele sunt scrise de la stânga la dreapta și de sus în jos. Ne deplasăm de-a lungul paginii site-ului nostru exact în același mod.
Următoarea în cursul progresului nostru este celula centrală a celui de-al doilea tabel. Aici vom introduce textul. Nu este necesar să completați tabelul în această ordine, dar în acest caz, Păstrez această ordine pentru claritate.
Pentru ca textul să arate așa cum avem nevoie, trebuie să îl formatăm, să setăm indentarea, fontul, dimensiunea fontului și alți parametri de care avem nevoie dacă este necesar.
1. Nu trebuie să setați nicio aliniere, doar scrieți textul și acesta va fi aliniat la stânga în mod implicit. De asemenea, puteți alinia textul în mod specific la centru, la stânga, la dreapta sau la lățimea textului. Prin urmare, atributele necesare pentru aceasta sunt:
align = "stânga" - la stânga;
align = „centru” - în centru;
align = "dreapta" - la dreapta;
align = "justify" - pentru a se potrivi cu lățimea textului.
Nota: Dacă doriți să puneți text pe o pagină fără tabel (am dat un exemplu de pagină făcută fără tabel: ca în această Novelizare) - pur și simplu puneți atributul de aliniere în eticheta de paragraf:
De asemenea, puteți alinia textul folosind o etichetă de container
Textul va arăta astfel: Text aliniat la centru Dacă introducem textul de care avem nevoie într-o celulă de tabel, atributul de aliniere trebuie să fie scris în eticheta celulei corespunzătoare, în acest caz în celula centrală a celui de-al doilea tabel. 2. Acum să setăm atributele textului însuși: font, culoarea fontului și dimensiunea fontului. Pentru aceasta aveți nevoie de următoarele atribute: 2.2. culoare - culoare; 2.3. Atributul size specifică dimensiunea fontului; Font mare
Tipărire fine Dar nu recomand folosirea acestei metode deoarece dimensiunea fontului va depinde de browserul utilizatorului. Un utilizator care provine din browserul Opera, unde scala implicită este 100%, va vedea dimensiunea fontului ="+4" moderat mare și ușor de citit. Un utilizator care vizitează Internet Explorer, care are „Cele mai mari pictograme” în mod implicit, va vedea textul tău pur și simplu gigantic și va începe să se întrebe dacă site-ul tău este conceput pentru persoanele cu deficiențe de vedere. Puteți specifica dimensiunea fontului folosind un stil, ca acesta: STYLE="font-size:24pt". Dacă setăm dimensiunea fontului la 20pt în acest fel, întreaga linie va arăta astfel: Vă rugăm să rețineți că, dacă specificați un stil, atunci este plasată o cratimă între font și dimensiune: font-size. Explicație: Puteți lua numele fontului fie din secțiunile corespunzătoare ale oricărei lecții HTML, fie din Microsoft Word. Dar rețineți că nu toate fonturile sunt reflectate în browsere diferite, așa că nu ar trebui să vă lăsați dus de fonturi exotice. Explicația 2: culoarea fontului poate fi specificată și în cuvinte (roșu, albastru, verde etc.), dar atunci este mai bine să scrieți astfel:
TEXT Atributul span înseamnă că avem de-a face cu un element de paragraf inline. Este folosit pentru a schimba aspectul textului sau pentru a-l evidenția logic. De exemplu, culoarea. Nu există multe nume de culori pe care browserul le poate citi, așa că recomand să folosiți valorile lor numerice. Pentru a afla aceste valori numerice te poti referi la numeroase tabele de culori, sau la programul Photoshop. Și orice alte diagrame de culori pe care le puteți găsi. Culorile „periculoase” sau „sigure” nu contează. Toate sunt citite în mod egal. Singura diferență este capacitățile monitorului fiecărui utilizator. 3. Să scriem o etichetă în interiorul celulei cu atributele necesare pentru a seta parametrii textului nostru. Ordinea în care sunt scrise atributele în interiorul etichetei nu este importantă. În acest caz, am setat culoarea fontului - #000000 - negru: Notă: nu uitați că fiecare etichetă trebuie să fie închisă. În acest caz, închideți mai întâi eticheta interioară ( 4. Acum trebuie să setați paragraful și linia roșie. Dar, din păcate, acest text va arăta neted doar în browserele FireFox și Internet Explorer. În browser-ul Opera, va arăta... mmm... Ca un tânăr taur care face pipi... În general, foarte neuniform. Pentru a seta o indentație de paragraf, trebuie să scrieți un stil pentru aceasta și să o denumiți, de exemplu, „p1”. Am explicat deja că stilul începe cu atributul „stil”. Numai că acum acest atribut nu va fi responsabil pentru culoare sau dimensiunea fontului, ci pentru indentarea paragrafului și a textului. Acest stil ar trebui scris astfel:
Textul justificat arată cel mai bine. Acesta este modul în care textul este aliniat în cărți, reviste și alte materiale tipărite. Prin urmare, vom seta alinierea în celulă la lățimea textului. Eticheta celulei va arăta astfel:
2.1. font - înseamnă font;
față - față, adică numele fontului în HTML. În mod similar, cuvântul „familie” este folosit pentru a stabili stilul despre care vom vorbi mai târziu;
Font Arial
Culoarea fontului (în acest caz, liliac)
Puteți specifica dimensiunea fontului în puncte:
Este mai bine să setați parametri mai precisi
Dimensiunea fontului 20pt.
Și setați culoarea - liliac și dimensiunea fontului - 24 pt în același timp:
Dimensiunea fontului 24 pt.
Cuvântul STILE se poate referi la multe alte sensuri, altele decât font. Prin urmare, dacă specificați un stil - un atribut care indică faptul că specificați un stil special pentru dimensiunea fontului ("font-size: 24pt"), întregul atribut este citat: STILE="font-size: 24pt"
Puteți folosi aceste tabele de culori:
Text justificat. Text justificat. Text justificat. Text justificat. Text justificat. Text justificat.
Etichetă
În HTML, acest construct este folosit pentru a introduce caractere speciale. Dacă browserul întâlnește un semn ca acesta (&) în text (se numește ampersand), începe să interpreteze literele care îl urmează ca un cod pentru un caracter special. Aceasta continuă până când se întâlnește punct și virgulă. În acest caz folosim pentru a adăuga un spațiu. Adăugând câteva spații, obținem o indentație.
Dacă adăugăm opt astfel de construcții, vom avea o indentație de opt caractere.
Dacă vrei ca textul tău să arate întotdeauna profesional în toate browserele, trebuie să apelezi la o metodă mai complexă.