html tekst - Kurs HTML i CSS
HTML dla zielonych / Ćwiczenia...właściwej treści strony. Wyniki swojej pracy możesz na bieżąco oglądać w przeglądarce internetowej. W tym celu zapisz plik pod nazwą index.html, a następnie odszukaj go na dysku za pomocą dowolnego programu do przeglądania plików (w systemie Windows możesz użyć np. Eksploratora plików) i dwukrotnie kliknij ikonę stworzonego właśnie dokumentu. Dzięki temu Twoja strona otworzy się w przeglądarce. Za każdym razem kiedy coś na niej zmienisz, po prostu ponownie zapisz plik w edytorze, a...
Tekst CSS / Wyrównanie tekstu {text-align}...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 ułożenia na ekranie. Przykład {text-align} wyrównanie left (domyślnie) wyrównanie left - do...
HTML dla zielonych / Akapit HTML <p "text-align">...akapity, są rozdzielone linijką przerwy. Treść akapitu należy wpisać pomiędzy znacznikami <p> oraz </p>. Przyjęło się, że praktycznie każdy zwykły tekst na stronie WWW umieszcza się w akapitach. Pojedynczy akapit przedstawia ustęp w tekście, który nieco różni się tematycznie od poprzedniego. Zamiast stosować dwa znaczniki końca linii: <br><br>, można po prostu objąć wybrany fragment tekstu paragrafem. Efekt będzie identyczny, a dodatkowo przeglądarka lepiej wyświetli taki tekst. Dzięki temu...
- Podcast HTML / #8 Formularze HTML
...w sklepach internetowych. Formularz funkcjonuje jako elektroniczna ankieta, którą wypełnia się bezpośrednio na stronie. Umożliwia to wpisywanie tekstu, odpowiadanie na pytania oraz zaznaczanie jednej lub kilku możliwości. Prosty formularz może być przesłany pocztą elektroniczną e-mail (tzw. prosty formularz pocztowy). W przypadku przesyłania poufnych danych (np. numerów kart kredytowych), należy zadbać o bezpieczeństwo, co można osiągnąć za pomocą skryptów wykonywanych po stronie...
- Podcast HTML / #9 HTML5
...błędów. Wprowadzenie nowych znaczników semantycznych, aby uczynić sieć bardziej dostępną. Uproszczona deklaracja typu dokumentu to <!doctype html>, która nie przełącza przeglądarki w tryb Quirks. Uproszczono również deklarację strony kodowej do <meta charset="utf-8">. Nowe elementy semantyczne i strukturalne W języku HTML5 wprowadzono nowe elementy, które tworzą sekcje lub grupują zawartość, w tym: Sekcje: <article>, <aside>, <nav>, <section>. Znaczniki grupujące: <figure>...
- HTML dla zielonych / Znaczniki HTML
...nie można zapominać o wstawianiu znaczników zamykających! W języku HTML nie ma żadnego znaczenia jakimi literami wpisujemy znaczniki, np. znacznik <html> możemy równie dobrze wpisać tak: <hTmL>. Przyznasz jednak, że ten drugi sposób jest mało czytelny. Dlatego w tym kursie wszystkie znaczniki będą pisane małymi literami. Praktycznie każdy edytor HTML oferuje: Kolorowanie składni polega na tym, że jeśli wpiszemy poprawny znacznik, jego składnia przyjmie określony kolor - zależny od ustawień...
- Podcast HTML / #5 Tabele HTML
...<td>...</td>: tworzy pojedynczą komórkę (rubrykę) w tabeli, czyli prostokątną przestrzeń na przecięciu wiersza i kolumny, w której można umieścić tekst lub inne elementy. Należy pamiętać, że komórki tabeli <td> muszą znajdować się wewnątrz znaczników wierszy <tr>. Domyślnie tabele nie mają obramowania, co może sprawić, że są mało czytelne. Obramowanie można dodać za pomocą atrybutu <table border="1">. Wąską tabelę można wyśrodkować, używając atrybutu style="margin: auto" w znaczniku...
Indeks, wyszukiwarka / Skrypt indeksu, wyszukiwarki...Wklej do niego poniższy kod i zapisz w pliku indeks.js (koniecznie użyj kodowania utf-8): /** * @author Sławomir Kokłowski {@link https://www.kurshtml.edu.pl} * @copyright NIE usuwaj tego komentarza! (Do NOT remove this comment!) */ function Indeks(id, ramka) { this.id = id; if (typeof ramka == 'undefined') this.ramka = self; else if (typeof ramka == 'string') { if (ramka == '_blank') this.ramka = ''; else if (ramka == '_self') this.ramka = self; else if (ramka...
- Menu w CSS / Menu z nagłówkami
...krótkiego nagłówka, zapisanego wewnątrz <dt>...</dt> - taki kod również jest poprawny semantycznie: <dl> <dt>CSS</dt> <dd><a href="czcionki.html">Czcionki</a></dd> <dd><a href="tekst.html">Tekst</a></dd> <dd><a href="tlo.html">Tło</a></dd> <dd><a href="marginesy.html">Marginesy</a></dd> <dd><a href="obramowanie.html">Obramowanie</a></dd> </dl> Efekt bez stylizacji: CSS Czcionki Tekst Tło Marginesy Obramowanie Oczywiście takie menu może zawierać więcej niż jeden...
- HTML dla zielonych / Koniec linii HTML <br>
...stosuje się gdy chcemy natychmiastowo zakończyć linię. Zapytasz zapewne: Po co go stosować, nie można po prostu nacisnąć Enter i przenieść kursor tekstowy do następnej linii? Otóż nie można. Przeglądarka internetowa ignoruje wszelkie znaki przejścia do następnej linii za pomocą klawisza Enter (ignoruje również postawienie obok siebie więcej niż jednej spacji - zobacz: Znaki specjalne). Na przykład jeśli wpiszesz w edytorze taki tekst: To jest pierwsza linia... a to jest druga linia. w...