Existují dva typy rozvržení webu: tabulkové a blokové. A zatímco první je vhodnější pro vytváření jednoduchých html stránek, druhý je ideální, pokud potřebujete přidat jednotlivé prvky ve formě bloků.
Instrukce
Krok 1
Existují dvě techniky, které vám umožní vyvinout návrh bloku sami: vložením kaskádových stylů do dokumentu nebo jejich připojením z externího zdroje. Oba dávají stejný výsledek, takže mezi nimi není zásadní rozdíl. V prvním případě vložte následující kód kamkoli do souboru style.css:
.block1 {
}
Blok1 - název bloku, můžete napsat libovolný jiný. Mezi složenými závorkami zadejte parametry v následujícím formátu: název atributu> dvojtečka> hodnota> středník (včetně umístění před složenou závorku). Běžně se používají následující prvky:
- šířka - šířka (500px, 100% atd.);
- výška - výška (200px, 25% atd.);
- pozadí - barva pozadí (žlutá, červená, # 000000);
- výplň - výplň kolem obsahu uvnitř bloku (0px, 20%);
- marže - vnější marže z bloku (15px, 40%);
- ohraničení - rámeček (ohraničení: plná 0px černá;);
- float - zarovnání (vlevo, vpravo);
- border-radius - zaoblení rohů (border-radius: 10px;).
Krok 2
Při druhém použití CSS přidejte styl mezi značky a:
.block1 {
}
A přidejte požadované parametry.
Krok 3
Vložte blok na požadované místo na webu pomocí příkazu:
Blok 1
Uložte a obnovte stránku, měla by se objevit. Pamatujte, že zarovnání výšky se může lišit v závislosti na tom, jak plný je obsah. Pokud například nastavíte 300 pixelů, ale napíšete pouze jeden řádek textu, nebude se zobrazovat celý. To lze napravit například pomocí tabulky s požadovanými parametry, která by měla být umístěna uvnitř bloku, tj. mezi značkami a. A aby hranice nebyly viditelné, vložte atribut
