Posuvné pruhy sú zvislé a vodorovné pruhy pozdĺž pravého (pri písaní zľava doprava) a spodných okrajov okna alebo samostatnej oblasti v okne, určené na pohyb obsahu vertikálne alebo horizontálne. Webové stránky používajú prvky CSS (Cascading Style Sheets) vložené do kódu HTML na kontrolu ich vzhľadu a správania.
Inštrukcie
Krok 1
Značku div použite, ak chcete, aby sa posuvný panel zobrazoval nie pre celú stránku, ale iba pre jej obmedzenú oblasť. V značke HTML (HyperText Markup Language) označujú „značky“jednotlivé príkazy prehľadávača na zobrazenie konkrétneho prvku stránky. V najjednoduchšej podobe je značka div (často označovaná ako „vrstva“) napísaná takto:
Toto je text vo vnútri vrstvy
Toto je otváracia značka a záverečná značka. Všetko, čo je umiestnené medzi otváracou a zatváracou značkou, je vo vrstve ako v kontajneri a tento kontajner je možné dimenzovať - šírku a výšku. To sa deje pomocou doplnkového štýlu („atribútu“), ktorý by sa mal pridať do úvodnej značky:
Toto je text vo vnútri vrstvy
Krok 2
Zahrňte do atribútu štýl značky div a tiež pravidlá pre posúvače vrstvy:
Toto je text vo vrstve
Tu pretečenie: auto znamená, že posuvníky sa zobrazia automaticky, to znamená, keď sa obsah vrstvy nezmestí do určených rozmerov. Ak je auto nahradené rolovaním, budú tieto pruhy vždy prítomné, bez ohľadu na to, či sú potrebné alebo nie. Skrytá hodnota bude mať opačný efekt - zvitok sa nikdy nezobrazí, aj keď obsah tohto kontajnera nie je viditeľný za jeho okrajmi.
Krok 3
Podobnou metódou môžete na stránku ako celok pridať posuvníky. Predvolene sa zobrazujú podľa potreby, ale ak je z nejakého dôvodu nevyhnutná ich stála prítomnosť na stránke, do zdrojového html-kódu by sa malo pridať zodpovedajúce pravidlo štýlu. V kóde stránky nájdite zatváraciu značku na hlavičke dokumentu a napíšte pred ňu tieto štýlové pokyny:
body {overflow: scroll;}
