Yann LeCun získal 1 miliardu dolárov na vytvorenie AI, ktorá rozumie fyzickému svetu

Pridávanie okrajov k prvkom v CSS je základnou zručnosťou na zlepšenie vizuálnej príťažlivosti a štruktúry vašich webových stránok. Vlastnosť `border` je na to primárnym nástrojom, ktorý vám umožňuje ovládať **štýl**, **šírku** a **farbu** orámovania prvku v jednej deklarácii. ### Skrátená vlastnosť „hranice“. Najbežnejším spôsobom pridania okraja je použitie skrátenej vlastnosti „border“. Jeho syntax je jednoduchá: ```css orámovanie: [šírka] [štýl] [farba]; Ak chcete napríklad pridať 2-pixelový plný čierny okraj okolo obrázka: ```css img { orámovanie: 2px plná čierna; } Môžete tiež definovať každý aspekt okraja samostatne, aby ste získali podrobnejšie ovládanie: – „šírka okraja“: nastavuje hrúbku (napr. „1 pixel“, „0,5 em“, „tenký“). – „štýl okraja“: definuje štýl čiary (napr. „plná“, „prerušovaná“, „bodkovaná“, „dvojitá“, „drážka“). - `border-color`: Určuje farbu (pomocou pomenovaných farieb, hodnôt HEX, RGB alebo HSL). ### Použitie okrajov na konkrétne strany CSS poskytuje presné ovládanie a umožňuje vám pridávať okraje na jednotlivé strany prvku pomocou týchto vlastností: - "na okraji". - „pravá hranica“. - "hranica-dole". - „ľavá hranica“. Každý z nich má rovnakú syntax „[šírka] [štýl] [farba]“. Ak chcete napríklad pridať dekoratívne podčiarknutie nadpisu: ```css h2 { border-bottom: 4px prerušované #ff6b6b; } ### Bežné štýly ohraničenia a prípady použitia Vlastnosť „border-style“ ponúka rôzne vizuálne možnosti: - **`plné`**: súvislá čiara. Ideálne na gombíky a nádoby. - **`čiarkovaný`**: Séria čiarok. Užitočné na označenie neaktívnych oblastí. - **`bodkovaný`**: postupnosť bodiek. Často sa používa na jemné oddeľovače. - **`double`**: Dve paralelné čiary. Vytvára formálnejší, orámovaný efekt. - **`drážka`**: 3D drážkovaný efekt v závislosti od farby okraja. ### Praktické tipy a osvedčené postupy 1. **Použite s `border-radius` pre zaoblené rohy**: Skombinujte `border` s vlastnosťou `border-radius` na vytvorenie zjemnených hrán a moderných, priateľských komponentov používateľského rozhrania. ```css .tlačidlo { orámovanie: 2px plné #4ecdc4; border-radius: 8px; } 2. **Pamätajte si model krabice**: Ohraničenie pridáva k celkovým rozmerom prvku. Ak máte prvok s definovanou šírkou a výškou 100 pixlov a pridáte orámovanie 5 pixlov, jeho celková vykreslená veľkosť bude 110 x 110 pixlov. Použite `box-sizing: border-box;`, ak chcete zahrnúť orámovanie a výplň v rámci špecifikovanej šírky a výšky prvku. 3. **Priehľadné okraje pre stabilné rozloženia**: Niekedy môžete pridať „priehľadné“ orámovanie ako zástupný symbol, aby ste zabránili posunom rozloženia pri pridávaní alebo odstraňovaní okraja pri interakcii používateľa (napríklad „:ukázať kurzorom“). Zvládnutie okrajov CSS je kľúčovým krokom pri vytváraní vizuálne pútavých a dobre štruktúrovaných webových stránok. Experimentujte s rôznymi štýlmi, šírkami a farbami, aby ste zistili, ako môžu zlepšiť váš dizajn. a zabaliť ho do div s class="faq-section". Nesmiete použiť markdown. Nepoužívajte žiadne ďalšie značky HTML okrem formátovania div a otázky. Odpoveď na každú otázku by mala byť v odseku.