align - Kurs HTML i CSS
Układ elastyczny CSS / Wyrównanie wiersza {align-items, align-self}(CSS 3 - interpretuje Internet Explorer 10, Firefox, Opera 12, Chrome) Spis treści {align-items, align-self} Wspólne wyrównanie wiersza {align-items} Indywidualne wyrównanie wiersza {align-self} Wspólne wyrównanie wiersza {align-items} selektor { align-items: wyrównanie } Selektorem może być kontener elastyczny. Wyrównanie: flex-start - wyrównanie wiersza do początkowej krawędzi kontenera flex-end - do końcowej krawędzi kontenera center - wyśrodkowanie wiersza (dla tekstu w języku...
HTML dla zielonych / Akapit HTML <p "text-align">...atrybuty, które obsługuje. W przypadku akapitu można zastosować m.in. następujące: Wyrównanie tekstu do lewej strony (domyślnie) <p style="text-align: left">Treść akapitu</p> lub po prostu <p>Treść akapitu</p> Wyrównanie tekstu do prawej <p style="text-align: right">Treść akapitu</p> Wyśrodkowanie tekstu <p style="text-align: center">Treść akapitu</p> Justowanie tekstu (wyrównanie do obu marginesów jednocześnie) <p style="text-align: justify">Treść akapitu</p> We wszystkich...
- Pozycjonowanie CSS / Ustawienie {float, vertical-align}
Spis treści {float, vertical-align} Ustawienie w poziomie {float} Ustawienie w pionie {vertical-align} Ustawienie w poziomie {float} selektor { float: sposób } Polecenia nie można zastosować do elementów pozycjonowanych absolutnie. Selektorem może być praktycznie dowolny znacznik, który nie został wypozycjonowany absolutnie [zobacz: Wstawianie stylów]. Natomiast jako "sposób" należy podać: left - element ustawiony po lewej stronie, względem elementów sąsiadujących right - element...
- Tekst CSS / Wyrównanie tekstu {text-align}
selektor { text-align: wyrównanie } Selektorem może być dowolny znacznik wyświetlany w bloku, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "wyrównanie" należy podać: left - wyrównanie tekstu do lewego marginesu (domyślnie) right - wyrównanie do prawego marginesu center - do środka (wyśrodkowanie) justify - do obu marginesów jednocześnie (justowanie) Polecenie pozwala wybrać jeden z możliwych sposobów wyrównania tekstu, czyli jego...
- Układ elastyczny CSS / Wyrównanie wierszy {align-content}
(CSS 3 - interpretuje Internet Explorer 10, Firefox, Opera 12, Chrome) selektor { align-content: wyrównanie } Selektorem może być kontener elastyczny, którego elementy zostały ułożone w wielu wierszach. Wyrównanie: flex-start - wyrównanie wierszy do początkowej krawędzi kontenera flex-end - do końcowej krawędzi kontenera center - wyśrodkowanie wierszy (dla tekstu w języku polskim - w pionie) space-between - równe odstępy między wierszami space-around - równa przestrzeń wokół wierszy...
- CSS dla zielonych / Wyrównanie tekstu CSS {text-align}
...jakie dają style CSS, nie musimy tego robić dla każdego akapitu osobno. Wystarczy że w arkuszu CSS wpiszemy następującą regułę stylów: p { text-align: wyrównanie; } Dzięki temu tekst we wszystkich akapitach na stronie zostanie wyrównany w określony sposób: left - wyrównanie tekstu do lewego marginesu (domyślnie) right - wyrównanie do prawego marginesu center - do środka (wyśrodkowanie) justify - do obu marginesów jednocześnie (justowanie) Pytania i odpowiedzi {text-align} Jak...
- HTML dla zielonych / Łączenie znaczników i atrybutów HTML <p "text-align", span "font-size, color", b, i, u>
...kolor czcionki, pogrubienie, pochylenie, przekreślenie) dotyczące tekstu można łączyć, np. po wpisaniu w edytorze: <p style="text-align: center"><span style="font-size: large; color: red"><b><i><u> To jest jakiś tekst </u></i></b></span></p> otrzymamy: To jest jakiś tekst Zauważ, że znaczniki zamykamy w kolejności odwrotnej jak je otwieraliśmy. Czyli najpierw zamykamy znacznik, który został otwarty jako ostatni (w naszym przykładzie jest to: <u>), a na końcu zamykamy ten...
- Komendy CSS 2 / text-align
WARTOŚĆ left | right | center | justify | <łańcuch znakowy> | inherit OPIS Wyrównanie tekstu INICJALIZACJA zależy od przeglądarki ZASTOSOWANIE elementy blokowe DZIEDZICZENIE tak PROCENTY nie MEDIA visual
- Komendy CSS 2 / vertical-align
WARTOŚĆ baseline | sub | super | top | text-top | middle | bottom | text-bottom | <procent> | <długość> | inherit OPIS Pionowe ustawienie INICJALIZACJA baseline ZASTOSOWANIE elementy inline i komórki tabeli DZIEDZICZENIE nie PROCENTY odnosi się do wysokości linii elementu MEDIA visual
- Szablon strony na DIV-ach / Stały szablon
...szablonu Menu nawigacyjne Treść strony Stopka serwisu html, body { background-color: #fff; color: #000; margin: 0; padding: 0; text-align: center; } #top { width: 780px; margin-left: auto; margin-right: auto; text-align: left; } #NAGLOWEK { background-color: #888; } #MENU { width: 150px; float: left; overflow: hidden; background-color: #ccc; } #TRESC { width: 630px; float: left; overflow: hidden; background-color: #fff; } #STOPKA { clear: both; width...