przykład - Kurs HTML i CSS
Czcionki CSS / Waga czcionki {font-weight}...Jak zrobić pogrubiony tekst w CSS? Aby zrobić pogrubiony tekst w CSS, użyj właściwości font-weight i przypisz jej wartość bold. Na przykład: "font-weight: bold" pogrubia tekst. Jak zmienić grubość czcionki HTML? W HTML można zmienić grubość czcionki za pomocą atrybutu style="..." i wartości font-weight. Na przykład: <p style="font-weight: bold">Tekst pogrubiony</p> tworzy pogrubiony tekst.
- Czcionki CSS / Rodzaj czcionki {font-family}
...w CSS można ustawić za pomocą właściwości font-family, która określa preferowany rodzaj czcionki lub listę rodzajów czcionek do wyświetlenia. Na przykład: "font-family: 'Helvetica', sans-serif" ustawia czcionkę na "Helvetica" lub, jeśli nie jest dostępna, na czcionkę bezszeryfową. Co oznacza "font-family: serif"? Słowo kluczowe serif w właściwości font-family odnosi się do rodzaju czcionek z dodatkowymi zakończeniami (szeryfami) na literach. Czcionki "serif" są zazwyczaj bardziej...
- Tło CSS / Tło obrazkowe {background-image}
...jako tło w CSS? Aby ustawić obrazek jako tło w CSS, można użyć właściwości background-image i podać ścieżkę dostępu do obrazka jako wartość. Na przykład: "background-image: url('sciezka/do/obrazka.jpg')". Jak dodać tło do zdjęcia? Aby dodać tło do zdjęcia z elementami przezroczystymi w CSS, można jednocześnie użyć właściwości background-image do ustawienia obrazka jako tła oraz background-color do określenia koloru tła. Na przykład, jeśli obrazek ma format GIF lub PNG z elementami...
- Tło CSS / Zaczepienie tła obrazkowego {background-attachment}
Spis treści {background-attachment} Zaczepienie tła obrazkowego {background-attachment} Wielokrotne zaczepienie Zaczepienie tła obrazkowego {background-attachment} (interpretuje Internet Explorer 9, Firefox, Opera, Chrome) selektor { background-attachment: zaczepienie } Jako "zaczepienie" należy wpisać: scroll - przewijanie tła (domyślnie) fixed - tło nieruchome względem okna przeglądarki local - tło nieruchome względem elementu (jeśli posiada on suwaki), ale przewijane względem...
- Pozycjonowanie CSS / Nakładanie {z-index}
...do wszystkich przypadków, gdzie występują współrzędne ekranowe, np. w edytorach do 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...
- Obramowanie CSS / Atrybuty mieszane zaokrąglenia obramowania {border-radius}
...Jak zaokrąglić "border"? Aby zaokrąglić border w CSS, można użyć właściwości border-radius i określić wartość promienia zaokrąglenia. Na przykład: "border-radius: 10px" zaokrągli wszystkie cztery rogi obramowania o promieniu 10 pikseli. Jak zaokrąglić DIV CSS? Aby zaokrąglić rogi <div> w CSS, użyj właściwości border-radius i określ wartość promienia zaokrąglenia. Na przykład: <div style="border-radius: 10px; background-color: lightgray; padding: 20px">Treść</div> zaokrągli...
HTML5 / Załącznik <figure, figcaption>...bo inaczej dokument utraciłby spójność. Przykład <figure> <p>Język HTML5 upraszcza deklarowanie strony kodowej dokumentu. Na <a href="#listing1">przykładzie 1</a> możemy się przekonać, jak to zrobić.</p> <figure id="listing1"> <pre><code> <meta charset="UTF-8"> </code></pre> </figure> <p>Krótszą formę ma również deklaracja typu dokumentu.</p> Warto zwrócić uwagę, że gdyby tekst akapitu był sformułowany w inny sposób, użycie znacznika FIGURE mogłoby być raczej niewłaściwe...
- HTML5 / Pasek wyniku <meter>
...w ankiecie), podczas gdy pasek postępu jest przeznaczony wyłącznie do określania stopnia ukończenia jakiegoś zadania. Przykład <meter> Zobacz przykład: METER Przedziały wartości <meter low high optimum> (interpretuje: Firefox 16, Opera 11.5, Chrome 6) Wersja podstawowa: <meter value="współczynnik" low="niski" high="wysoki">alternatywa</meter> Minimum i maksimum: <meter value="wartość" min="minimum" max="maksimum" low="niska" high="wysoka">alternatywa</meter> Wartość optymalna...
- HTML5 / Blokada autouzupełniania <form autocomplete, input autocomplete, select autocomplete, textarea autocomplete>
...wprowadzania danych poprzez automatyczne sugerowanie i uzupełnianie wartości na podstawie wcześniejszych wpisów lub zapisanych danych. Na przykład, w formularzu <input type="text" name="email"> przeglądarka może automatycznie wypełnić adres e-mail użytkownika, który był wcześniej używany. Jak wyłączyć autouzupełnianie w HTML? Autouzupełnianie można wyłączyć w HTML, dodając atrybut autocomplete="off" do tagu <form>, <input>, <select> lub <textarea>. Na przykład: <input...
- HTML5 / Automatyczne zogniskowanie <... autofocus>
...w HTML jest używana do automatycznego ustawienia fokusu na określonym elemencie formularza, takim jak pole tekstowe, gdy strona jest załadowana. Na przykład, używając <input type="text" name="username" autofocus>, przeglądarka automatycznie ustawi kursor w polu username podczas ładowania strony. Jak ustawić domyślny fokus w HTML? Domyślny fokus w HTML można ustawić, dodając atrybut autofocus np. do tagu <input>, <textarea> lub <select>. Na przykład, <input type="text" name="search...