width - Kurs HTML i CSS
Pozycjonowanie CSS / Nakładanie {z-index}...tworzenia i obróbki grafiki komputerowej. Przykład {z-index} Oto przykład normalnego pozycjonowania (bez użycia z-index). Po wpisaniu: <img style="width: 100px; height: 75px; position: relative" src="obrazek.jpg" alt="..."><br> <img style="position: relative; left: 84px; bottom: 91px" src="punkt.gif" alt="..."> Otrzymamy: A to przykład z użyciem z-index. Po wpisaniu: <img style="width: 100px; height: 75px; position: relative; z-index: 2" src="obrazek.jpg" alt="..."><br> <img...
- Pozycjonowanie CSS / Wyświetlanie {display}
...1px solid gray">komórka4</td> </tr> </table> komórka1 komórka2 komórka3 komórka4 To jest zwykły tekst display: inline-block; width: 150px; height: 100px; background-color: silver To jest zwykły tekst Dla porównania zwykły blok: To jest zwykły tekst width: 150px; height: 100px; background-color: silver To jest zwykły tekst Pytania i odpowiedzi {display} Do czego służy "display" w CSS? W CSS, właściwość display kontroluje sposób, w jaki element jest renderowany w...
AutoIFRAME / Kilka ramek AutoIFRAME...odrębny identyfikator id="...". Na przykład tak mógłby wyglądać fragment strony głównej serwisu: <iframe src="..." name="..." id="autoiframe" width="100%" height="560">...</iframe> <iframe src="..." name="..." id="autoiframe2" width="100%" height="560">...</iframe> Nic nie stoi na przeszkodzie, aby wstawić więcej niż dwie ramki <iframe>...</iframe> - każda kolejna z innym identyfikatorem id="...". Następnie na końcu wszystkich podstron wczytywanych do ramki id="autoiframe" - nazwijmy...
- AutoIFRAME / Skrypt AutoIFRAME
...należy na stronie głównej do znacznika <iframe>...</iframe> dodać atrybut id="autoiframe", np.: <iframe src="..." name="..." id="autoiframe" width="100%" height="560">...</iframe> UWAGA! Pamiętaj, aby podać taką wysokość ramki (height="..."), która będzie wygodna w przypadku, gdyby skrypt nie zadziałał! Teraz na wszystkie podstrony, które będą wczytywane do ramki lokalnej, należy wstawić następujący kod (trzeba to zrobić koniecznie w nagłówku dokumentu, czyli w ramach...
- Rozmiary CSS / Wysokość i marginesy automatyczne
...jak w punkcie 7 podrozdziału: Szerokość i marginesy automatyczne, tzn. muszą spełniać następujące równanie: 'top' + 'margin-top' + 'border-top-width' + 'padding-top' + 'height' + 'padding-bottom' + 'border-bottom-width' + 'margin-bottom' + 'bottom' = wysokość bloku obejmującego 5. Elementy pozycjonowane absolutnie, zastępowane Sytuacja jest podobna jak w poprzednim punkcie za wyjątkiem tego, że element posiada wewnętrzną wysokość (zobacz punkt 8 podrozdziału...
Zareklamuj się tutaj za darmo...HTML - darmowe szkolenie: tworzenie stron internetowych" title="Kurs HTML - darmowe szkolenie: tworzenie stron internetowych" style="border: 0; width: 88px; height: 31px"></a> Możliwa jest wymiana linkiem: Kurs HTML - darmowe szkolenie: tworzenie stron internetowych <a href="https://www.kurshtml.edu.pl" title="Kurs HTML - darmowe szkolenie: tworzenie stron internetowych">Kurs HTML - darmowe szkolenie: tworzenie stron internetowych</a> Jeżeli prowadzisz wyjątkowo popularny serwis, Twój...
- Obramowanie CSS / Obramowanie obrazkowe {border-image-source}
...</div> </div> </div> ...oraz CSS: .ramka { background: url(obramowanie.gif) no-repeat top; padding-top: 12px; width: 200px; } .ramka_pojemnik { background: url(obramowanie2.gif) no-repeat bottom; padding-bottom: 12px; } .ramka_zawartosc { background: #92C892 url(obramowanie3.gif) repeat-y center; padding: 0 12px; color: #031; } Uzyskany efekt: To jest przykład tradycyjnie wykonanego "obramowania" obrazkowego. Wymaga zagnieżdżenia w sobie aż...
HTML5 / Nowe atrybuty HTML5...IFRAME Dokument do renderowania w ramce IFRAME translate Wszystkie elementy Czy element ma być tłumaczony, gdy strona jest lokalizowana width, height INPUT (type="image") width - wymiar poziomy; height - wymiar - pionowy wrap TEXTAREA Sposób, w jaki wartość kontrolki formularza ma być zawijana podczas wysyłania formularza writingsuggestions Wszystkie elementy Czy element może oferować podpowiedzi w trakcie pisania (ang. writing suggestions), czy nie Żródło: HTML...
- Układ elastyczny CSS / Kolejność {order}
...<div id="top"> <div id="TRESC">Treść strony...</div> <div id="MENU">Menu nawigacyjne</div> </div> #top { display: flex; } #MENU { width: 150px; min-width: 150px; order: -1; } [porównaj: Płynny szablon] Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść...
- Komendy CSS3 / Czcionki CSS
...<numeric-spacing-values> || <numeric-fraction-values> || ordinal || slashed-zero || <east-asian-variant-values> || <east-asian-width-values> || ruby || [ sub | super ] ] Inicjalizacja normal Zastosowanie wszystkie elementy Dziedziczenie tak Procenty zobacz cechy indywidualne Media visual font-variant-caps Wariant wielkości liter czcionki Wartość normal | small-caps | all-small-caps | petite-caps | all-petite-caps | unicase | titling-caps Inicjalizacja normal...