xhtml, css i javascript. pierwsza pomoc full.pdf

XHTML, CSS i JavaScript.

Pierwsza pomoc

Autorzy : Maria Sokó³ , Rados³aw Sokó³

ISBN: 978-83-246-1071-6

Format: A5, stron: 100

• Pocz¹tki – tworzenie szkieletu strony WWW i struktury dokumentu HTML

• Wygl¹d strony – kodowanie znaków, krój pisma i kaskadowe arkusze stylów

• Elementy witryny – listy, tabele, obrazy, odnoœniki

• Interaktywnoœæ – formularze, bazy danych, historia dzia³añ u¿ytkownika

Masz œwietne pomys³y i chcia³byœ pokazaæ je œwiatu? A mo¿e za³o¿y³eœ firmê i chcesz

siê zareklamowaæ? Najlepsz¹ wspó³czesn¹ wizytówk¹ jest interesuj¹ca, funkcjonalna

strona internetowa. Jeœli chcesz idealnie dopasowaæ j¹ do swoich potrzeb, najlepiej

by³oby zaj¹æ siê ni¹ osobiœcie. Jak jednak stworzyæ tak¹ stronê? Jak zapewniæ jej

dobre dzia³anie, intuicyjnoœæ obs³ugi i w³aœciw¹ strukturê? O co chodzi z tymi wszystkimi

znacznikami? Co to jest CSS? Jak rozmieœciæ poszczególne elementy i u³atwiæ poruszanie

siê po witrynie? I czy da siê j¹ po³¹czyæ z baz¹ danych? Nie martw siê – spieszymy

z pierwsz¹ pomoc¹. Na te oraz wiele innych technicznych pytañ szybko i jasno

odpowie Ci ta w³aœnie ksi¹¿ka!

• Projektowanie – tworzenie szkieletu strony WWW i struktury dokumentu HTML

• Czynnoœci podstawowe – u¿ywanie znaczników, kodowanie znaków

• Formatowanie – definiowanie po³o¿enia, rozmiaru i koloru tekstu, ustawianie

koloru strony

• U¿ywanie kaskadowych arkuszy stylów (CSS)

• Dodawanie elementów – listy, tabele, odnoœniki zewnêtrzne i pocztowe

• Wstawianie obrazów – zmiana rozmiaru, ustawianie wzglêdem tekstu,

pozycja na stronie

• Rola pakietu XAMPP i umieszczanie strony na serwerze

• Kontakt z u¿ytkownikiem – formularze, wprowadzanie danych, historia

odwiedzin

• Bazy danych – po³¹czenie ze stron¹, operacje na danych, prawa dostêpu

• Wykorzystywanie technologii AJAX na stronach WWW

Oto recepta na szybkie stworzenie w³asnej strony WWW!

XHTML, CSS i JavaScript

Spis treści

Wstęp / 5

1. Co to są znaczniki? / 7

2. Jak utworzyć podstawowy szkielet strony WWW? / 10

3. Gdzie umieścić tytuł strony WWW? / 13

4. Co to jest kodowanie znaków i jakie są jego techniki? / 14

5. Gdzie ustawić kodowanie polskich znaków w kodzie HTML? / 16

6. Jak korzystać z atrybutów tekstu? / 19

7. Jak zdeiniować wyrównanie tekstu w akapicie? / 21

8. Jak zdeiniować kolor tekstu i tła akapitu? / 24

9. Jak zdeiniować krój pisma i rozmiar czcionki? / 27

10. Jak ustawić marginesy akapitu tekstu? / 29

11. Jak budować strukturę dokumentu HTML za pomocą

nagłówków? / 31

12. Jak utworzyć na stronie WWW listy wypunktowane

i numerowane? / 33

13. Jak przygotować prostą stronę WWW? / 36

14. Jak deiniować kaskadowe arkusze stylów? / 38

15. Co to jest odnośnik i jak go skierować do innej strony WWW? / 43

16. Jak modyikować odnośniki za pomocą CSS? / 47

17. Jak zdeiniować odnośnik pocztowy? / 49

18. Do czego służą kotwice nazwane? / 50

19. Jak wstawić obraz na stronę WWW? / 53

20. Jak zmienić rozmiary obrazu? / 56

21. Jak określić pozycję obrazu na stronie WWW? / 57

22. W jaki sposób określić relację obraz – tekst? / 58

23. Jak zapewnić płynną zmianę rozmiarów obrazu przy zmianie

rozmiarów okna przeglądarki? / 60

Spis treści

XHTML, CSS i JavaScript

24. Jak zdeiniować tabelę w XHTML? / 62

25. Jak wykorzystać tabelę do budowy strony WWW? / 65

26. Jak stworzyć układ strony o postaci tabeli z wykorzystaniem

wyłącznie CSS? / 68

27. Jak umieścić na stronie WWW formularz? / 75

28. Jak wyświetlić na ekranie komunikat z wykorzystaniem

JavaScript? / 81

29. Jak wyświetlić element w oknie pop-up za pomocą

JavaScript? / 85

30. Jak przygotować galerię obrazów? / 87

31. Jak zdeiniować menu rozwijane za pomocą JavaScript? / 90

Spis treści

XHTML, CSS i JavaScript

odwiedzających jego serwis WWW i automatyzować kon-

takty. Mają postać elektronicznej ankiety, którą wypełnia się

wprost na stronie.

Formularz deiniujemy za pomocą elementu form z odpo-

wiednimi atrybutami, w którym umieszczamy pola formu-

larza:

27. Jak umieścić

na stronie WWW

formularz?

zawartość formularza

</form>

Pamiętaj, aby wszelkie zdania w formularzu, pola, zestawy

opcji itp. obejmować jakimiś pojemnikami, na przykład znacz-

nikami akapitu <p> czy bloku <div> .

W tym przykładzie przygotujemy formularz, który pozwoli

na wysyłanie za pomocą poczty elektronicznej wprowadzanych

przez użytkownika informacji. W związku z tym w deinicji

formularza powinniśmy umieścić specjalne polecenie wysyłania

formularza na wskazany adres:

action=="mailto:autor_strony@adres.pl".

Należy również określić sposób komunikowania się prze-

glądarki użytkownika z serwerem, a więc wskazać w kodzie,

czy przesyła ona jakieś informacje, czy też je pobiera. Do wybo-

ru mamy dwie metody — post lub get — zastosujemy metodę

post .

Aby zebrane z formularza dane były w czytelnej postaci,

powinniśmy zastosować parametr enctype="text/plain" . Tak

więc znacznik <form> ma teraz postać:

<form enctype="text/plain" action="mailto:autor_strony@adres.

pl?subject=Ankieta" method="post">

Formularz może zawierać różnego typu pola, w które będą

wprowadzane dane — na przykład takie jak imię i nazwi-

sko, nazwa produktu, informacje o użytkowniku itp. Pola te

są podzielone na kilka podstawowych grup:

Pole input , z dodatkowymi parametrami type , name

i value , służy do tworzenia pól, w których czytelnik

strony może wpisać informację lub wybrać jakąś opcję.

F ormularze pozwalają autorowi strony zbierać dane od osób

XHTML, CSS i JavaScript

Oto przykład:

<input type="text" name="nazwa_pola" value="wartość początkowa"

size="rozmiar pola w znakach" maxlength="maksymalny rozmiar

pola">

lub

Pole select służy do tworzenia rozwijalnych list z opcja-

mi, spośród których czytelnik wybiera interesujące

go pozycje:

<p><strong>Wybierz produkt:</strong></p>

<div>

<option> Avocado

<option> Cebula

<option> Ogórek

<option> Marchew

<option> Seler

</select>

</div>

textarea jest poleceniem pozwalającym tworzyć większe

pole tekstowe z przeznaczeniem na dłuższy komentarz

czytelnika:

<p><b>Wpisz swoje uwagi:</b></p>

</form>

76 27. Jak umieścić na stronie WWW formularz?

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika: