dodać - Kurs HTML i CSS
- CSS dla zielonych / Marginesy strony CSS {margin, margin-top, margin-bottom, margin-left, margin-right}
...Pytania i odpowiedzi {margin} Jak ustawić marginesy w CSS? W tym celu najlepiej w arkuszu stylów do selektora właściwego ciała dokumentu dodać deklarację o odpowiedniej wartości. Na przykład: body { margin: 20px; } ustawi wszystkie marginesy strony o szerokości i wysokości 20 pikseli. Jak ustawić margines 2,5 cm? W języku CSS oprócz pikseli możemy używać również szeregu innych jednostek długości. Na przykład: body { margin: 2.5cm; } ustawi wszystkie marginesy strony o...
- HTML dla zielonych / Indeks górny i dolny HTML <sup, sub>
...Do czego służy znacznik SUB? Jest to skrót od angielskiego sława subscript oznaczającego indeks dolny przy poprzedzającym go tekście. Jak dodać tekst do góry HTML? Aby wyświetlić pomniejszony tekst nieco wyżej od zwykłej linii tekstu i tym samym stworzyć indeks górny, należy użyć następującego kodu: x<sup>2</sup>. W tym przykładzie cyfra 2 zostanie wyświetlona jako indeks górny litery x.
- HTML5 / Element edytowalny <... contenteditable>
...ogóle nie będzie edytowalny. Pytania i odpowiedzi <div contenteditable> Jak zrobić edytowalny kod HTML? Aby zrobić edytowalny kod HTML, należy dodać atrybut contenteditable="true" do dowolnego elementu HTML, co sprawi, że użytkownicy będą mogli edytować jego zawartość bezpośrednio na stronie. Na przykład: <div contenteditable="true">Edytowalny tekst</div>. To sprawia, że zawartość tego <div> stanie się edytowalna. Jaki jest pożytek z contenteditable w HTML? Atrybut contenteditable...
- CSS dla zielonych / Klasy selektorów CSS <div class>
...{ background-color: gray; color: silver; } Zwróć uwagę, że w kodzie HTML wartość atrybutu class nie zawiera znaku kropki - trzeba ją dodać tylko w arkuszu stylów. Należy jednak pamiętać, że pomiędzy znakiem kropki a nazwą klasy w selektorze nie może być żadnych białych znaków - nawet spacji. W samej nazwie klasy najlepiej używać wyłącznie małych liter bez polskich znaków diakrytycznych. Nazwa klasy nie może również zawierać spacji - zamiast niej możesz użyć np. znaku myślnika...
- CSS dla zielonych / Ramki z tekstem CSS {background-color, padding, padding-top, padding-bottom, padding-left, padding-right, border-width, border-style, border-color, border-radius}
...To jest przykład ramki z tekstem... Możemy również zrezygnować z obramowania i zaokrąglonych narożników: To jest przykład ramki z tekstem... albo dodać tylko obramowanie z marginesami wewnątrz, ale bez tła: To jest przykład ramki z tekstem... Oczywiście na jednej stronie możemy używać jednocześnie kilku różnie wyglądających ramek z tekstem. W tym celu wystarczy w arkuszu stylów zdefiniować każda klasę z inną nazwą. Pytania i odpowiedzi {border-style, background-color} Jak zrobić...
- Nagłówek i treść HTML / Plik robots.txt
...w wynikach wyszukiwania np. Google. Gdzie jest plik robots.txt? Plik robots.txt nie jest obowiązkowy. Jeśli twórca witryny zdecydował się go dodać, musi się on znajdować w głównym folderze ze stroną WWW i mieć dokładnie taką nazwę (ważna jest również wielkość liter!). Na przykład jeśli serwis znajduje się pod adresem https://www.example.com/, to adres pliku powinien być następujący: https://www.example.com/robots.txt.
- Nagłówek i treść HTML / Strona kanoniczna <link "canonical">
...zarówno pod adresem https://www.example.com/ jak i https://www.example.com/index.html znajduje się identyczna treść, w tym drugim dokumencie możemy dodać znacznik: <link rel="canonical" href="https://www.example.com/">.
- HTML5 / Pola formularza <input "color, date, datetime-local, email, month, number, range, search, tel, time, url, week" min max step multiple>
...tym przypadku obsługiwane. Programy pocztowe dają możliwość wysłania e-maila do wielu adresatów jednocześnie. Ponadto do tego samego listu możemy dodać kilka plików załączników. Taki same efekt możemy uzyskać przypisując do pola odpowiedniego typu atrybut logiczny (wstawiany bez wartości) multiple. Wtedy w jednym miejscu będziemy mogli podać listę wartości rozdzieloną przecinkami. Przykład <input "email" multiple> Zobacz przykład: multiple
- HTML5 / Blokada autouzupełniania <form autocomplete, input autocomplete, select autocomplete, textarea autocomplete>
...hasła zapisanymi wcześniej wartościami. Jak usunąć autouzupełnianie w polu tekstowym? Aby usunąć autouzupełnianie w polu tekstowym, należy dodać atrybut autocomplete="off" do tagu <input>. Na przykład: <input type="text" name="field" autocomplete="off">. To zapobiega przeglądarkom sugerowaniu i automatycznemu uzupełnianiu wartości w tym polu.
- HTML5 / Podpowiedź pola formularza <input placeholder, textarea placeholder>
...w danym polu, np.: placeholder="Wprowadź swój e-mail". Jak ustawić "placeholder"? Aby ustawić "placeholder" w polu formularza HTML, należy dodać atrybut placeholder="..." do elementu <input> lub <textarea> . Przykład: <input type="text" placeholder="Wprowadź swoje imię"> lub <textarea placeholder="Wpisz swoją wiadomość"></textarea>.

