border - Kurs HTML i CSS
- HTML5 / Otwierany panel <details, summary>
...nawet użycie CSS, tak aby otwarty panel prezentował się wizualnie inaczej niż zamknięty - np. można dodać do niego czerwoną ramkę: details[open] { border: 1px solid red; } Przykład <details, summary> Zobacz przykład: DETAILS, SUMMARY
- Selektory atrybutów CSS / Selektor atrybutu o określonej wartości
...nie wpłynęło to na pola innego typu (np. na przycisk wysłania formularza - type="submit"), należałoby wpisać np. taką regułę: input[type="text"] { border: 1px solid black } Niestety również ta deklaracja nie jest interpretowana przez MSIE 6 🙁. Jedynym rozwiązaniem problemu wydaje się użycie klasy selektorowej dla każdego pojedynczego znacznika pola tekstowego w formularzu. Wtedy przynajmniej będzie można określić wszystkie własności formatowania elementu w jednym miejscu (arkuszu stylów)...
- Skórki
...specjalnego odsyłacza: <a href="javascript:void(0)" onclick="skin.set('/style.css'); return false"><img src="zrzut ekranu" alt="Nazwa skórki" border="0"></a> /style.css Lokalizacja arkusza stylów skórki. zrzut ekranu Obrazek ze zrzutem ekranu skórki. Oczywiście w miejsce znacznika obrazka <img> można wstawić również zwykły tekst. Nazwa skórki Tekst alternatywny dla przeglądarek niegraficznych. Jeżeli struktura katalogów serwisu nie jest płaska, tzn. poszczególne podstrony...
- Selektory pseudoklas CSS / Atrybut języka :lang
...nie zostanie zastosowana: */ p[lang|="pl"] { color: blue } Przykład :lang Po wpisaniu w arkuszu stylów: p:lang(en) { color: red } div:lang(en) { border: 1px solid red } a następnie w kodzie źródłowym: <p lang="en">1. This is paragraph with attribute <b>lang="en"</b>.</p> <p lang="en-US">2. This is paragraph with attribute <b>lang="en-US"</b>.</p> <div lang="en">This is block with attribute <b>lang="en"</b>... <p>3. This is paragraph inside block, but without attribute lang.</p> <p...
- Selektory pseudoklas CSS / Pusty element :empty
...pusty element-dziecko), nie otrzymały zmienionego formatowania. Przykład z użyciem elementu, który nie posiada znacznika zamykającego: img:empty { border: 1px solid red }
- Komendy CSS3 / Przekształcenia CSS
...Dziedziczenie nie Procenty odnosi się do rozmiaru obszaru odniesienia transform-box Obszar odniesienia przekształcenia Wartość content-box | border-box | fill-box | stroke-box | view-box Inicjalizacja view-box Zastosowanie przekształcalne elementy - tzn. takie, których ułożenie jest kontrolowane przez CSS z wyjątkiem nie-zastępowanych elementów inline, kolumn i grup kolumn tabeli Dziedziczenie nie Procenty nie transform-origin Początek przekształcenia Wartość [ left | center...
- Indeks, wyszukiwarka / Wygląd
...wykorzystując polecenia CSS. W tym celu w pliku indeks.css należy wkleić np.: #indeks { width: 300px; padding: 10px 0; background: #ccc; border: 2px outset #aaa; text-align: center; margin: 1em auto; } #indeks input.text { width: 290px; } #indeks select { width: 100%; margin: 2px 0 10px 0; } #indeks input.button { width: 100px; margin-left: 5px; margin-right: 5px; } W wyróżnionych miejscach wpisano identyfikator indeksu, zdefiniowany uprzednio w pliku...