stronie - Kurs HTML i CSS
Pozycjonowanie CSS / Pozycja relatywna {position: relative}...względem okna przeglądarki). Co to jest "position" w CSS? position w CSS to właściwość, która określa sposób pozycjonowania elementu na stronie. Ta właściwość ma kilka możliwych wartości, które kontrolują zachowanie pozycji elementu względem innych elementów na stronie. Co to jest "position: relative"? "position: relative" w CSS oznacza, że element pozostaje w swojej pierwotnej przestrzeni na stronie, ale jego pozycję można dostosować za pomocą właściwości top, right, bottom...
- Pozycjonowanie CSS / Wyświetlanie {display}
...niektórych elementów strony podczas jej drukowania [zobacz: Media]. Nie ma raczej sensu drukować menu nawigacyjnego, które powtarza się na każdej stronie, ponieważ na papierze i tak będzie ono całkowicie bezużyteczne. Zastosowanie tego polecenia pozwoli zaoszczędzić trochę papieru, a jednocześnie sprawi, że wydruk będzie wyglądał bardziej spójnie. Polecenie display: none jest zbliżone do visibility: hidden. Różnica polega na tym, że pierwsze z nich całkowicie usuwa element z ekranu...
- Jednostki CSS / Długość
...korzeniem jest zawsze element <html> Jednostka rem może być przydatna w sytuacji, kiedy chcemy, aby definiowana długość (np. szerokość bloku na stronie) odnosiła się do określonego rozmiaru czcionki, ale jednocześnie chcemy ją uniezależnić od wartości wyliczonych zgodnie z zasadą dziedziczenia stylów. Przykładowo załóżmy, że wysokość czcionki korzenia (element <html>) wynosi 16px, a dla <body> ustalono "font-size: 2em". Jeżeli teraz na stronie wstawimy blok ze stylem "width: 10em...
- CSS dla zielonych / Czcionka CSS {font-size, font-family}
Podobnie jak w przypadku koloru tła oraz tekstu dobrze jest również ustalić rozmiar i krój czcionki na całej stronie. body { font-size: rozmiar; font-family: rodzaj; } gdzie jako "rozmiar" należy wpisać: xx-small Czcionka najmniejsza x-small Czcionka bardzo mała small Czcionka mała medium Czcionka średnia large Czcionka duża x-large Czcionka bardzo duża xx-large Czcionka największa Natomiast zamiast rodzaj należy wpisać krój czcionki (np.: Arial, 'Courier New', 'Times New Roman...
- CSS dla zielonych / Kolor odsyłaczy CSS {color} :hover
a { color: kolor; } a:hover { color: podświetlenie; } gdzie "kolor" oznacza definicję koloru, jaką mają przyjąć wszystkie odsyłacze na stronie. Natomiast "podświetlenie" określa definicję koloru, jaką przyjmie odsyłacz po wskazaniu go myszką. Zwróć uwagę, że koloru podświetlenia nie da się podać w inny sposób, niż przy pomocy języka CSS. A jest to bardzo przydatna możliwość. W ten sposób po wskazaniu elementu myszą użytkownik od razu widzi, że jest to element interaktywny, który można...
Losowy elementSpis treści Losowy element Kilka losowych elementów Wszystkie elementy w kolejności losowej Losowy element Często przydatną funkcją na stronie WWW może okazać się wyświetlenie losowego tekstu lub obrazka. Można w ten sposób np. zbudować bazę cytatów albo porad i prezentować je użytkownikowi losowo - jeden przy każdym wejściu na stronę. Innym zastosowaniem może być rotacja bannerów lub buttonów. Jeśli chcesz umieścić na swojej stronie kilka bannerów, ale masz na to tylko jedno miejsce...
- AutoIFRAME / Skrypt AutoIFRAME
Aby zastosować taki skrypt, należy na stronie głównej do znacznika <iframe>...</iframe> dodać atrybut id="autoiframe", np.: <iframe src="..." name="..." id="autoiframe" width="100%" height="560">...</iframe> UWAGA! Pamiętaj, aby podać taką wysokość ramki (height="..."), która będzie wygodna w przypadku, gdyby skrypt nie zadziałał! Teraz na wszystkie podstrony, które będą wczytywane do ramki lokalnej, należy wstawić następujący kod (trzeba to zrobić koniecznie w nagłówku dokumentu, czyli w...
Tekst HTML / Kod poprawny semantycznie...powiedzieć, że roboty wyszukiwarek są "niewidome"! Dlatego na pewno docenią, że chcesz im pomóc w prawidłowym zaindeksowaniu (zapisaniu informacji o stronie w ich bazie danych) swojej strony. Mogą się odwdzięczyć oczywiście wyższą pozycją na liście wyszukiwania, co bezpośrednio wpłynie na popularność Twojego serwisu WWW. Dla robotów wyszukiwarek sieciowych nie jest obojętne, czy do oznaczania tytułów rozdziałów użyjesz znaczników <h1>...</h1> - <h6>...</h6>, czy może <font size="7">...</font>...
- HTML dla zielonych / Akapit HTML <p "text-align">
...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 strona...
- Formularze HTML / Pole wyboru <input "checkbox">
...przy którym można wybrać kilka spośród podanych gotowych odpowiedzi. Dla zaawansowanych Jeśli zamierzasz wykorzystać formularz w skrypcie po stronie klienta (np. JavaScript), każde pole tego typu powinno posiadać dodatkowo unikalny identyfikator (atrybut id="..."). Żadne dwa elementy w dokumencie nie mogą mieć takiego samego identyfikatora, nawet pola dotyczące tego samego pytania. W skrypcie należy posługiwać się tymi właśnie identyfikatorami a nie nazwami. Jeżeli wysyłasz formularz...