Elementele de bază HTML pentru începători

HTML - limbajul documentelor de marcare. Pronunția corectă - HSBC Chi Um El i.

HTML - este un document limbaj de marcare pentru browser. Word'om aici este browser-ul și documentul - pagina HTML. Aceasta este bazată pe înțelegerea HTML a ceea ce este necesar pentru a nu confunda documentele lingvistice Web markup cu un limbaj de programare. Numele vorbește de la sine - folosim marca HTML în sus. care va fi afișat pe element de pagină, imagine sau text și în ce ordine vor urma reciproc.







Da, un simplu set de formatare a textului, si aplicatii de birou nu au nimic în comun cu programare. Dar cititorul atent va observa un detaliu important - într-un procesor de text tastam, edita și formatul de text și imagini cu ajutorul butoanelor vizuale și de meniu, dar de ce codul HTML este scris de mână? De ce învăța atât de multe detalii tehnice de a scrie markup pentru un document?

Deci, HTML, vom scrie doar pixuri. instrumente adecvate pentru editare vizuală a HTML nu au venit, și ei sunt puțin probabil să apară. HTML limbaj de marcare este ușor de a învăța și de a înțelege, și scrie codul HTML de automatizare înseamnă mult, dar asta e pentru alte lecții.

Structura unui document HTML

Am decis ca documentul HTML va fi scris de mână, adică, de a impune. codare HTML - procesul de creare a unui document HTML. Oamenii de rând și cercurile informed - doar make-up. Fiecare document are o structură și anumite reguli de construcție. Care sunt elementele codului este, ce structura în HTML?

Vă rugăm să rețineți, documentele HTML au extensia .html.

Deci, în ordine, de exemplu.

- tipul documentului (DOCTYPE)

Această construcție este întotdeauna specificat la începutul documentului la corect „înțelegere“ a browser-ului ce versiune de HTML este utilizat în construcția documentului.

Deoarece HTML evoluează în mod constant, are mai multe versiuni, precum și orice produs software. Versiunea actuală a HTML - a cincea și exemplificată doctype este relevantă.

În principiu, mai adânc în studiul tipurilor de documente nu există nici un sens, deoarece odată cu lansarea HTML5, acest design a devenit standard. Doar introduceți-l în partea de sus a documentului de fiecare dată când începe să impună aspectul site-ului.

- începutul documentului

Primul tag-ul pe care ne întâlnim după DOCTYPE, acesta .

tag-ul HTML - o unitate structurală de document HTML marcare. Codul HTML este alcătuit din blocuri, care sunt numite tag-uri. Fiecare etichetă are propria funcție, și învățarea limbajului HTML marcare, în cele din urmă, se află în studiul etichetele și proprietățile lor în document.







Trebuie remarcat faptul că HTML de învățare nu este o astfel de sarcină complicată, deoarece s-ar putea părea la prima vedere. Aflați cum să utilizați etichetele de documente de marcare - nu o astfel de sarcină mare pe creier.

Astfel, documentul începe cu o etichetă de marcare și se termină cu eticheta de închidere . Fiecare etichetă care conține alte etichete sau elemente de închidere trebuie să fie închise. De exemplu, , ,

, și t. d.

etichetă Este necesară, deoarece conține toate structura documentului și un înveliș pentru celelalte elemente.

etichetă

În continuare, vom vedea tag-ul . care conține alte elemente care nu este clar pentru noi. Acesta conține alte elemente - ceea ce înseamnă că elementele sau tag-urile sunt situate între deschiderea și închiderea structurii de tag-ul:

etichetă Conceput pentru stocarea informațiilor meta a unui document HTML, adică, informații care nu apare în document, dar este un important și în mare parte determinată de modul în care va arăta documentul și cum să se comporte.
Această etichetă este necesară într-un document.

etichetă - titlul documentului</h4> <p>antet <title> tag-ul este obligatorie. conținând textual meta-informații, care este afișat în titlu browser-ul sau file. etichetă <title> Acesta trebuie să fie în tag-ul <head>. De asemenea, conținutul tag-ul este utilizat de motoarele de căutare pentru a afișa documentul în rezultatele căutării.</p> <h4>meta Tag <meta charset="UTF-8"></h4> <p>Meta tag-ul care conține informații despre codificarea caracterelor documentului. Este foarte de dorit să specificați eticheta în toate documentele noi pentru a afișa în mod corespunzător. Absența acestei etichete poate duce la faptul că în loc de cuvintele de pe pagină va afișa caracterul necunoscut, iar textul nu va mai fi lizibile și chelovekoponyatnym.</p> <p>Meta - tag-ul specializat, conceput pentru a furniza date structurate despre pagină. Meta Tag-uri sunt cele mai frecvent utilizate în tag-ul <head>. Meta tag-uri nu sunt necesare în structura unui document HTML.</p> <p>Vă recomandăm tuturor documentelor HTML să utilizeze inițial codificarea UTF-8. ca în exemplul de mai sus.</p> <h4>Favicon (favicon)</h4> <p>Conectați-vă la imaginea documentului fișier un favicon. Favicon (favicon) - o pictogramă în miniatură, care apare lângă numele documentului în fila browser-ului. Favicon - dimensiunea fișierului grafic 16 x 16 (sau 32 x 32 pixeli), care pot avea diferite formate, cum ar fi png, jpg, ICO, gif. utilizată în mod tradițional în format ICO. favicons animate - aceasta fișiere gif care conțin animație. Uita-te la favicon animat este posibil, de exemplu, VKontakte, atunci când sosește un mesaj nou.</p> <h4>Stilurile documentului CSS</h4> <p>Conectați-vă la fișierul CSS documentul cu stilul HTML.</p> <p>CSS - Cascading stiluri document HTML. Fiecare etichetă care este în tag-ul <body>, există un set de proprietăți, cum ar fi - culoarea, lățimea, înălțimea, poziția în raport cu alte elemente. Toate aceste proprietăți și au stiluri CSS care pot fi luate într-un fișier extern. desen <link> conectează fișierele externe HTML document, inclusiv stiluri CSS.</p> <p>Notă: construcții proprietate href <link> specifică locația unui fișier extern. În exemplul nostru, style.css fișierul și favicon.ico. Ele sunt în același folder ca și fișierul index.html. <link> Ea nu are o etichetă de închidere.</p> <h4>etichetă <script></h4> <p>În exemplul nostru, vă conectați un fișier script.js extern. care este în același folder ca și fișierul principal index.html.</p> <p>Deci, prieteni, am discutat despre elementele de bază care sunt utilizate în tag-ul <head> mai des. În plus față de aceste elemente, pentru <head> Există o serie de alte, mai specifice, și nu obligatoriu.</p> <p>tag-ul de închidere <head> și etapa ulterioară.</p> <h4>Corp aka corp</h4> <p>Aici începe cel mai interesant și vizual palpabil în aspectul documentului HTML.</p> <br> <br> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8686842323494376" data-ad-slot="8576168847" data-ad-format="auto"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <br> <br> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:inline-block;width:300px;height:600px" data-ad-client="ca-pub-8686842323494376" data-ad-slot="9162386769"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <br> <br> </div> <div class="extra"> <div class="info"><a href="/articles/fantoma-81-eskd.html">anterior</a> ◈ <a href="/articles/pancreatita-este-ceea-ce-este.html">următoarea</a></div> <div class="clear"></div> </div> </article> </div> </div> </div> </div> <div id="sidebar" class="col-1-3"> <div class="wrap-col"> <div class="box"> <div class="heading"><h4 class="title">Meniu</h4></div> <div class="content"> <a href="/tags/windows.html" class="tag-links" title="57" style="font-size: 12pt;">Windows</a> <a href="/tags/abstract.html" class="tag-links" title="68" style="font-size: 13pt;">abstract</a> <a href="/tags/acasa.html" class="tag-links" title="226" style="font-size: 24pt;">acasă</a> <a href="/tags/care.html" class="tag-links" title="77" style="font-size: 13pt;">care</a> <a href="/tags/care-este.html" class="tag-links" title="72" style="font-size: 13pt;">care este</a> <a href="/tags/cauze.html" class="tag-links" title="99" style="font-size: 15pt;">cauze</a> <a href="/tags/ceea-ce.html" class="tag-links" title="69" style="font-size: 13pt;">ceea ce</a> <a href="/tags/comentarii.html" class="tag-links" title="83" style="font-size: 14pt;">comentarii</a> <a href="/tags/copii.html" class="tag-links" title="98" style="font-size: 15pt;">copii</a> <a href="/tags/copil.html" class="tag-links" title="57" style="font-size: 12pt;">copil</a> <a href="/tags/cuvinte.html" class="tag-links" title="55" style="font-size: 12pt;">cuvinte</a> <a href="/tags/caini.html" class="tag-links" title="69" style="font-size: 13pt;">câini</a> <a href="/tags/de-ce.html" class="tag-links" title="96" style="font-size: 15pt;">de ce</a> <a href="/tags/dieta.html" class="tag-links" title="58" style="font-size: 12pt;">dieta</a> <a href="/tags/dragoste.html" class="tag-links" title="58" style="font-size: 12pt;">dragoste</a> <a href="/tags/dreapta.html" class="tag-links" title="105" style="font-size: 15pt;">dreapta</a> <a href="/tags/dvs.html" class="tag-links" title="47" style="font-size: 11pt;">dvs.</a> <a href="/tags/face.html" class="tag-links" title="110" style="font-size: 16pt;">face</a> <a href="/tags/fata.html" class="tag-links" title="63" style="font-size: 12pt;">fata</a> <a href="/tags/fata.html" class="tag-links" title="51" style="font-size: 12pt;">fată</a> <a href="/tags/flori.html" class="tag-links" title="53" style="font-size: 12pt;">flori</a> <a href="/tags/fotografie.html" class="tag-links" title="86" style="font-size: 14pt;">fotografie</a> <a href="/tags/fotografii.html" class="tag-links" title="79" style="font-size: 14pt;">fotografii</a> <a href="/tags/ghid.html" class="tag-links" title="66" style="font-size: 13pt;">ghid</a> <a href="/tags/gratuit.html" class="tag-links" title="77" style="font-size: 13pt;">gratuit</a> <a href="/tags/lui.html" class="tag-links" title="65" style="font-size: 13pt;">lui</a> <a href="/tags/manuale.html" class="tag-links" title="53" style="font-size: 12pt;">manuale</a> <a href="/tags/mediu.html" class="tag-links" title="142" style="font-size: 18pt;">mediu</a> <a href="/tags/maini.html" class="tag-links" title="109" style="font-size: 16pt;">mâini</a> <a href="/tags/mainile.html" class="tag-links" title="107" style="font-size: 16pt;">mâinile</a> <a href="/tags/nunta.html" class="tag-links" title="61" style="font-size: 12pt;">nunta</a> <a href="/tags/oameni.html" class="tag-links" title="51" style="font-size: 12pt;">oameni</a> <a href="/tags/on-line.html" class="tag-links" title="59" style="font-size: 12pt;">on-line</a> <a href="/tags/pisici.html" class="tag-links" title="52" style="font-size: 12pt;">pisici</a> <a href="/tags/prelegere-shkolopediya.html" class="tag-links" title="54" style="font-size: 12pt;">prelegere shkolopediya</a> <a href="/tags/par.html" class="tag-links" title="75" style="font-size: 13pt;">păr</a> <a href="/tags/sarcina.html" class="tag-links" title="55" style="font-size: 12pt;">sarcina</a> <a href="/tags/sfaturi.html" class="tag-links" title="65" style="font-size: 13pt;">sfaturi</a> <a href="/tags/simptome.html" class="tag-links" title="140" style="font-size: 18pt;">simptome</a> <a href="/tags/studopediya.html" class="tag-links" title="66" style="font-size: 13pt;">studopediya</a> <a href="/tags/sa-invete.html" class="tag-links" title="64" style="font-size: 13pt;">să învețe</a> <a href="/tags/tratament.html" class="tag-links" title="185" style="font-size: 21pt;">tratament</a> <a href="/tags/utilizarea.html" class="tag-links" title="51" style="font-size: 12pt;">utilizarea</a> <a href="/tags/vopsea.html" class="tag-links" title="58" style="font-size: 12pt;">vopsea</a> </div> </div> <div class="box"> <div class="content"> <div class="box"> <div class="content"> <br> <br> <script src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" async=""></script> <script> if(document.getElementsByTagName("body")[0].offsetWidth>=900) { document.write('<ins class="adsbygoogle" style="display:inline-block;width:300px;height:600px" data-ad-client="ca-pub-8686842323494376" data-ad-slot="1432548440"></ins>'); }else{ document.write('<ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8686842323494376" data-ad-slot="2447347631" data-ad-format="auto" data-full-width-responsive="true"></ins>'); } (adsbygoogle = window.adsbygoogle || []).push({}); </script> <br> <br> </script> </div> </div> </div> </div> <div class="box"> <div class="heading"><h4 class="title">Tag-uri articol</h4></div> <div class="content"> <a href="/tags/pentru-a-incepe-html.html">pentru a începe html</a>, <a href="/tags/html.html">HTML</a>, <a href="/tags/documentele-limbaj-de-marcare.html">documentele limbaj de marcare</a>, <a href="/tags/html-limbaj-de-marcare.html">HTML limbaj de marcare</a>, <a href="/tags/html-documente-limbaj-de-marcare.html">HTML documente limbaj de marcare</a> </div> </div> </div> </div> </div> </div> </section> <footer> <div class="wrap-footer pominodiko"> <div class="row"> <div class="col-1-1"> <div class="wrap-col"> <div class="box"> <div class="content"> </div> </div> </div> </div> </div> </div> <div class="copyright"> <p>Copyright © 2024</p> <script> new Image().src = "https://counter.yadro.ru/hit;scrieunblog?r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+ ";h"+escape(document.title.substring(0,150))+ ";"+Math.random();</script> </div> </footer></div> </body> </html>