CSS Framework: Impromptu a efekt

Kaskádové styly (CSS) pro svou logickou jednoduchost umožňují nejen vytvořit efektivní návrhové řešení, ale také poskytnout prvky s reálnou akcí, které napodobují provádění skutečného kódu.

Jakákoli vizuální značka značky HTML je obdélníkový prostor specifické struktury a obsahu. Prvek obsahuje informace o souřadnicích, velikostech, zarážkách, barvách, písmech, obrysů atd. Rámeček prvku CSS určuje jeho plochu, která se nachází od jeho okraje směrem dovnitř k šířce uvedené v popisu.

Popis syntaxe

Umístění prvku je určeno souřadnicemi vzhledem k levému hornímu rohu stránky (vlevo, horní), velikost horizontální a vertikální (šířka, výška). Celý návrh a animace prvku jsou prováděny ve dvojicích: "vlastnost: hodnota".

Popis se provádí přímo v kódu stránky, ve vložce stylu nebo v samostatném souboru a odkazuje se na něj pomocí odkazu LINK. Syntaxe:

#name {vlastnost: hodnota; Vlastnost: hodnota; Vlastnost: hodnota; ...}

Or

. Název {vlastnost: hodnota; Vlastnost: hodnota; Vlastnost: hodnota; ...}

Název může být také p, body, html, tabulka, td ..., tj. Značka značky HTML. Umožňuje připojit popis stylu přímo k prvku.

Předtím, než vytvoříte své vlastní varianty psaní stylů, neublíží to, jak se to udělalo na populárních webech, ukládáním kódu stránky nebo stisknutím klávesy Ctrl-U, aby se zobrazil přímo v prohlížeči.

Základní parametry

Aktuální rámec CSS prvku představuje styl (okrajový styl), barva ( barva ohraničení), šířka (šířka okraje). Můžete popsat vše podle jedné vlastnosti - hranice. Můžete jednotlivé okraje rámce popsat nezávisle (okraj, okraj, okraj vlevo, okraj doprava).

CSS rámec je popsán obecnými pravidly kaskádových stylových listů:

Hranice: 3px;
Barva okraje: červená;
Hraniční styl: dvojitá čárkovaná pevná tečka.

Tento popis nastavuje šířku rámečku na 3 pixely, barva je červená, boční styl: horní strana je dvojnásobná, pravá strana je přerušovaná, spodní strana je pevná, levý je bodkovaný.

Šířka hranice: 1px 2px 4px 8px;
Barva okraje: modrá;
Hraniční styl: bodkovaný.

Rozměry každé strany jsou také zobrazeny postupně, začínající od horní části, po směru hodinových ručiček, barva je modrá a styl je tečkovaný.

Barva okraje: modrá červená zelená černá;

V tomto popisu je barva každé strany samostatně označena. Vlastnost okrajů může obsahovat více parametrů najednou a rohy okraje mohou být zaokrouhleny:

Hranice: 1px zelená pevná;
Okraj poloměru: 0px 4px 8px 12px;
-moz-okraj-poloměr: 0px 4px 8px 12px;
-webkit-okraj-poloměr: 0px 4px 8px 12px;

Ze způsobu vytváření rámce v CSS závisí pohodlí návštěvníka, protože tento stylový efekt se obvykle používá pro technické účely: když je důležité přesně ukázat místo nebo velikost oblasti na stránce.

Tloušťka rámu a jeho účel

Při výběru tloušťky rámečku můžete použít px, pt, em ..., ale měli byste mít na paměti, že je vždy v oblasti prvku. Je těžké si představit, že rámec CSS má designový účel, ale technicky je velmi vhodné jej použít k zvýraznění prvků stránky.

Pokud je rámeček uzamčen v hlavní třídě, to znamená, že chybí, a pak jej ukazuje v pseudo-třídě: vznášející se, můžete zobrazit návštěvníkovi prvek stránky, když je kurzor myši na něm, například vyberte položku nabídky. Někdy je třeba něco vybrat kliknutím na obrázek nebo někde přetáhnout něco. Je velmi výhodné použít bodkovaný rám a neměnit pozadí prvku nebo jeho obsahu.

Některé aplikace potřebují vybrat oblast stránky nebo vybrat položky pro pozdější zpracování. V takovém případě můžete v okamžiku kliknutí vytvořit rám s rámečkem a dokud návštěvník neuvolní tlačítko myši, změní jeho velikost a vizuálně zobrazí výsledek výběru.

Mimo stanovených

CSS lekce jsou velmi zajímavé a je také důležité prozkoumat populární kódy stránek. Vlastní zdroj však musí být jedinečný, musí mít svůj vlastní obličej.

Rámec CSS, který poskytuje syntaxe, neposkytuje tolik rozmanitosti jako jeho vlastní iniciativa. Impromptu je skvělý začátek a nic z toho nemůže zabránit vývojáři při vytváření vlastního rámce. Zejména se všemi úspěchy internetových technologií a možností stávajících standardů existuje mnoho slibných myšlenek založených na skutečných nedostatcích v existující syntaxi, která byla (podle definice) vždy striktně formální.

Zejména pokud chceme vytvořit rámec těchto nebo jiných prvků, zdá se být rozumné to udělat komplexně. Zvýrazněním stran a úhlů určité oblasti v samostatných štítcích můžete získat ohromující účinky. A přiřazením vhodných nástrojů můžete vytvořit dynamické prvky stránky změnou polohy, tvaru a obsahu.