oznacza - Kurs HTML i CSS
- Rozmiary CSS / Szerokość {width}
...To jest tabela o szerokości 100px (width: 100px) Poniżej widać obrazek o szerokości 200px (width: 200px): Pytania i odpowiedzi {width} Co oznacza "width" w CSS? W CSS, właściwość width określa szerokość elementu HTML. Może być wyrażona jako wartość procentowa, pikselowa lub w innych jednostkach. Działa na elementach blokowych i inline-block, umożliwiając kontrolę nad szerokością kontenera lub elementu. Jak ustawić szerokość w CSS? Aby ustawić szerokość w CSS, użyj...
- Rozmiary CSS / Wysokość i marginesy automatyczne
...height wynosi auto. W takim przypadku ostateczna wysokość elementu jest obliczana ze wzoru: (ustawiona szerokość) / (wewnętrzne proporcje) co oznacza po prostu przeskalowanie elementu tak, aby zachował on swoje proporcje. 3. Elementy nie-zastępowane: blokowe oraz z oblewaniem (float) Jeżeli własności top, bottom, margin-top lub margin-bottom mają przypisaną wartość auto, przyjmują ostateczną wartość zero. Przypisanie wartości auto dla wysokości, spowoduje uzależnienie jej od wysokości...
- Pozycjonowanie CSS / Obcinanie {clip}
...zastosowanie tylko do elementów pozycjonowanych absolutnie. Przeglądarki stosują się do wytycznych z CSS 2.1. Wyrażenia: "góra, prawo, dół, lewo" oznaczają wartości współrzędnych wyciętego prostokąta, określane względem lewego-górnego narożnika elementu, tzn. są to pozycje odpowiednio: górnego-prawego oraz dolnego-lewego wierzchołka wyciętego prostokąta. Wartości te należy podawać za pomocą jednostek długości. Za każdą z nich można wpisać również auto, co oznacza pominięcie cięcia z...
- Pozycjonowanie CSS / Przyleganie {clear}
...do obrazka</p> <img style="float: left"> <p style="clear: none">Brak ograniczeń dotyczących przylegania</p> Pytania i odpowiedzi {clear} Co oznacza "clear" w CSS? W CSS, właściwość clear jest używana do kontrolowania zachowania elementów wobec elementów, które zostały ustawione na float. Ustawiając "clear: left" lub "clear: right" można wymusić, aby element położony poniżej innych elementów z "float: left" lub "float: right" nie opływał ich z boku i zaczynał się od nowego wiersza...
- Drukowanie CSS / Wydruk @media print
Jest oczywiste, że dokument wydrukowany na drukarce, wygląda inaczej niż na ekranie monitora (w przeglądarce internetowej). Podczas drukowania zwykle pomijane są wszystkie parametry, które dotyczą tła (trudno sobie wyobrazić wydrukowanie strony z czarnym tłem 🙂). Z uwagi na odrębność różnych mediów, wprowadzono możliwość definiowania oddzielnych własności dla różnych form prezentacji dokumentu. Na przykład rozmiar czcionki można ustalić zarówno dla ekranu, jak i dla drukarki, lecz dokumenty...
- Kolory CSS / Sposoby definiowania kolorów CSS
...w systemie szesnastkowym, w którym mamy 16 cyfr podstawowych: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Przykładowo: liczba szesnastkowa B5 oznacza w systemie dziesiętnym 181 (11*16 + 5 = 181). #RGB - to samo co powyżej, lecz w tym wypadku jako składowe kolorów należy podawać liczby jednocyfrowe w zapisie szesnastkowym. Przykładowo kolor #FB0 odpowiada #FFBB00 z poprzedniego zapisu. rgb(R, G, B) - pozwala podać oddzielnie każdą składową koloru w systemie dziesiętnym. Wszystkie...
- Układ wielokolumnowy CSS / Multi-column layout
...z jedną kolumną. Jednak w odróżnieniu od układu standardowego, zawartość szersza od kolumny (np. długi, niełamliwy wyraz) zostanie przycięta. Nie oznacza to raczej jednak, że od dzisiaj wszystkie serwisy internetowe powinny zacząć wszędzie stosować nowy sposób rozplanowanie tekstu. Zwróćmy uwagę, że w papierowych gazetach zwykle nie występują wspomniane już wcześniej elementy kontekstowe, menu, obiekty multimedialne, a reklamy najczęściej są umieszczane na osobnych stronach. Układ...
- Układ wielokolumnowy CSS / Wypełnienie kolumn {column-fill}
(CSS 3 - interpretuje Internet Explorer 10, Firefox 52, Opera 11-12 i 37, Chrome 50) selektor { column-fill: wypełnienie } Jako "wypełnienie" należy podać: balance Kolumny wypełnią całą możliwą szerokość elementu (domyślnie) auto Kolumny wypełnią całą możliwą wysokość elementu (ma sens tylko, jeśli jednocześnie określimy wysokość elementu, który zawiera kolumny) Przeglądarka stara się zawsze zrównoważyć kolumny tekstu w taki sposób, aby możliwie wszystkie (oprócz ostatniej) miały taką...
- Układ elastyczny CSS / Wyrównanie wiersza {align-items, align-self}
...należy podać jedną z wartości - analogicznie jak w przypadku wspólnego wyrównania. Oprócz tego można ustawić wartość "auto" (domyślnie), która oznacza przejęcie sposobu wyrównania z kontenera. Wyrównanie indywidualne pozwala ustawić w różny sposób każdy z elementów kontenera elastycznego. Jeżeli jednak wszystkie mają być wyrównane tak samo, korzystniej będzie zrobić to dla nich wspólnie. Pytania i odpowiedzi {align-items} Co robi "align-items"? W kontekście flexbox CSS, właściwość...
- CSS dla zielonych / Zaczynamy kurs CSS!
Zapewne znasz już podstawy języka HTML - jeśli nie, zapraszam najpierw do lektury rozdziału: HTML dla zielonych. Skoro nadal czytasz, zapewne oznacza to, że potrafisz stworzyć przynajmniej prostą stronę internetową zawierającą tekst, obrazki i odsyłacze. Chociaż treść jest najważniejszym elementem każdej strony WWW, to przecież wygląd też się liczy. I właśnie do tego służy język CSS (Kaskadowe Arkusze Stylów). Zapamiętaj prostą zasadę: treść wraz ze znacznikami wprowadza się na stronę...
