Care este structura blocului? Cum să impună o singură pagină a site-ului pe cont propriu?

Există o dorință de a învăța pentru a face propriile site-uri de pagini? Atunci să-au însușit ceea ce structura blocului. novice Aspect întâlni o serie de dificultăți, ei au o mulțime de întrebări. Luați în considerare ceea ce este de codificare bloc.

Un sfat de important

Utilizați editorul WYSIWYG, astfel încât totul a fost clar. Cei care cunosc bine HTML, lucru în notebook-uri, pentru că ei înțeleg totul. Și începătorii pot beneficia de programe, cum ar fi FrontPage sau, de exemplu, Dreamweaver.

Tipuri de site - uri de aspect

Există mai multe tipuri de aspect:

1. Tabelară.
2. Block.
3. Mixt.

Suntem interesați în structura blocului. Ceea ce îl diferențiază de masă? La aspectul de bloc, folosind tag-ul DIV are anumite avantaje:

1. Încărcați cu proiectarea blocurilor mai rapide.
2. Conținutul afișat blocuri (spre deosebire de tabele), așa cum are loc descărcarea. După cum se știe, aceste tabele se vor afișa numai după întregul tabel.
3. Codul cu div-uri mai ușor de citit.

Este nu toate avantajele, care este renumit pentru aspectul blocului.

Cum de a schimba locația div-blocuri?

Acest lucru ne va ajuta să plutească - această proprietate, care este capabil să următoarele:

1. Aliniere la stânga - stânga.
2. Pentru a alinia dreapta - dreapta.
3. Elementul rămâne acolo unde a fost, el nu se va muta dacă dat nici unul. Această valoare va fi implicit.

O altă caracteristică importantă de care avem nevoie - clar. El poate avea 4 valori:

1. Pentru instalare sub elementul anterior, muta la dreapta, blocul - dreapta.
2. seturi rămasă sub elementul anterior, care este deplasat spre stânga.
3. Ambele - Instalarea blocului deplasat anterior.
4. Niciuna indică absența restricțiilor privind poziția blocului în raport cu acele elemente care sunt mutate.

exemplu

Luați în considerare modul în care va arăta ca un bloc div aspect. Scriem codul nostru:

Sub acest cod vedeți rezultatul. Astfel, pe baza mai multor proprietăți pot fi controlate aranjament bloc după cum se dorește. Du-te la următorul moment. Am folosit text-align: centru, pentru a alinia fiecare bloc pentru orice browser.

După cum puteți vedea, este destul de simplu aspect bloc a site-ului. Este important să se studieze și să practice mai multe proprietăți care vor crea o structură mai flexibilă a paginilor.

Ceva mai important

Există o caracteristică populară care este utilizat în structura - poziția, este utilizat pentru poziționarea.

Valorile pentru proprietățile poziției:

1. Relativă - stabilește poziția elementelor în raport cu locațiile lor inițiale. Aplicație din stânga, sus, righ, element de mișcări de fund într-o anumită direcție.
2. Static - element normal de afișare. Nu are nici un sens să utilizeze dreapta / stânga, sus / jos - aceasta poate duce la nimic.
3. Absolute - element de poziționare absolută.
4. Fixe - similară absolută. Acesta este legat la un anumit punct de pe ecran, dar aceasta nu schimbă poziția, chiar dacă pagina de flipping.

Mulți aspect observat că atunci când se utilizează o poziționare fixă, absolută și relativă a blocurilor sunt suprapuse. Și apoi interesant de stiut care dintre blocurile de mai jos, care de mai sus. Pentru a răspunde la această întrebare, aveți nevoie de proprietatea z-index. Acesta a adus blocuri de aspect la un nou nivel. Acest lucru face posibilă nu numai pentru a face poziționarea planului, ci și prin intermediul celui de al treilea Z. axa Valoarea astfel de proprietate poate fi pozitiv sau negativ.

Crearea 3 blocuri. Apoi, experimentul cu poziționare absolută.

După cum puteți vedea, este ușor de a schimba poziția blocurilor. Pe baza faptului că acum sunteți în măsură, pentru a face orice pagină de aspect bloc elementar. Aplicarea mai multe proprietăți vă va îmbunătăți abilitățile dumneavoastră.