Skocz do zawartości



- - - - -

Rozpoczynamy przygodę ze środowiskiem HTML.


  • Nie możesz odpowiedzieć
15 odpowiedzi w tym temacie

#1 Le Kaczorek

    Nowy

  • Użytkownik
  • Pip
  • 5 postów
  • Miasto:Konin

Napisano 29/11/2011 - 23:25

Witam! Postaram się zrobić Wam skrócony kurs HTML. Każdy z nas chciałby założyć pierwszą stronę i pokazać ją innym.

1. Potrzebne materiały.
  • Notatnik lub polecany przeze mnie Notepad++
  • Ciepła herbatka, żeby w razie nie powodzeń dodać aromatu do pracy
  • Znaczniki, które można znaleźć na różnych portalach.
2. Od czego zaczynamy.
  • Odpalamy któryś z wyżej wymienionych edytorów tekstowych i wypisujemy strukturę strony.
3. Głowa strony

<html>
Otwiera on stronę.

<head>
Wypisujemy tutaj rzeczy, które mieszczą się na pasku informacji, ale też tagi czy opis strony. Oto co możemy dać w head:

<meta name="Description" content="Tu możesz wpisać opis swojej strony" />
<meta name="Keywords" content="Tu możesz wpisać słowa kluczowe tzw. tagi strony. Rozdzielamy je przecinkami.

Wiele osób pyta się jak zmienić tytuł wyświetlany na pasku. Otóż w head wystarczy umieścić:
<title>Tytuł Strony</title>

</head>
I gotowe!

4. Ciało strony - body.

Już wiemy jak wypisać informacje kluczowe dotyczące tagów, opisu czy tytułu. Zabierzmy się za ciało, czyli zawartość naszej pracy.

<body>
Otwieramy ciałko. Tutaj pojawia się kluczowy problem - co tak naprawdę chcemy pokazać internautom. Powiedzmy, że chcemy napisać coś o sobie.

<center>
Jest to wyśrodkowanie tekstu, które możemy użyć piszcząc nagłówek strony.

<h2> ... </h2>
Wielkość tego nagłówka. H1 największa / H6 najmniejsza.

Wypisujemy tutaj informacje, które chcemy zamieścić.

5. Zamykamy stronę.

Zamykanie znaczników jest proste. Wystarczy umieścić slash (/) przed znacznikiem.
! Znaczniki, które już zostały zamknięte typu head nie wymagają ponownego zamknięcia !

Zatem do dzieła:
</center>
</body>
</html>

Dlaczego wpierw center potem body, a nie np. pierwsze html? To jest proste. Pokaże to na zasadzie liczb:

1..2..3..4..5 zamykamy 5..4..3..2..1

Prościej się nie da : )

6. Podsumowanie

Umiecie już napisać poprawnie szkielet strony i rozpocząć pracę na zawartością, potem w następnym poradniku z cyklu "Rozpoczynamy przygodę ze środowiskiem HTML" dowiecie się jak wstawić zdjęcie, hiperłącze i inne cenne rzeczy, których pani na infie Was nie nauczy.

Pozdrawiam, Le Kaczorek.

#2 Krzysztof Baraniak

    Zakorzeniony

  • Administrator
  • PipPipPipPipPip
  • 174 postów
  • Miasto:Leszno

Napisano 29/11/2011 - 23:29

Bardzo ładny poradnik, cała podstawa. Masz ode mnie plusika.

Dołączona grafika


#3 Ryba123pl

    Aktywny

  • Użytkownik
  • PipPipPip
  • 40 postów

Napisano 30/11/2011 - 11:24

Nie zamknąłeś znacznika
</head>


#4 Le Kaczorek

    Nowy

  • Użytkownik
  • Pip
  • 5 postów
  • Miasto:Konin

Napisano 30/11/2011 - 15:05

Poprawiłem mały błąd. Myślę, że nawet początkujący by się domyślił, ale wiecie jak to jest :)

#5 Marek N.

    Początkujący

  • Użytkownik
  • PipPip
  • 22 postów

Napisano 03/12/2011 - 00:43

Wiele osób po prostu kopiuje gotowce, a brak zamknięcia Head'a mógłby popsuć ich plany. :D Ogólnie, poradnik dobry dla początkujących. :)

#6 ownede

    Początkujący

  • Użytkownik
  • PipPip
  • 17 postów

Napisano 04/12/2011 - 00:02

Kiepski tutorial. <center> nie stosujemy ;)

#7 Krzysztof Baraniak

    Zakorzeniony

  • Administrator
  • PipPipPipPipPip
  • 174 postów
  • Miasto:Leszno

Napisano 04/12/2011 - 14:18

Wyświetl postUżytkownik ownede dnia 04/12/2011 - 00:02 napisał

Kiepski tutorial. <center> nie stosujemy ;)
Lepsze jest z pewnością CSS'owe
margin: 0 auto;
:P

Dołączona grafika


#8 Jacob

    Początkujący

  • Użytkownik
  • PipPip
  • 23 postów
  • Miasto:LPU

Napisano 04/12/2011 - 19:06

Ja tam używam
margin: auto auto;
i tak samo działa ;)

#9 Krzysztof Baraniak

    Zakorzeniony

  • Administrator
  • PipPipPipPipPip
  • 174 postów
  • Miasto:Leszno

Napisano 04/12/2011 - 19:26

Wyświetl postUżytkownik Jacob dnia 04/12/2011 - 19:06 napisał

Ja tam używam
margin: auto auto;
i tak samo działa ;)

No tak, dałem przykład marginesu 0 od góry. :P

Dołączona grafika


#10 Le Kaczorek

    Nowy

  • Użytkownik
  • Pip
  • 5 postów
  • Miasto:Konin

Napisano 11/12/2011 - 00:49

ownede, a co chcesz mistrzu zastosować w htmlu do wyśrodkowania? :X

#11 Kamil.K

    Zakorzeniony

  • Użytkownik
  • PipPipPipPipPip
  • 109 postów
  • Miasto:Gdańsk

Napisano 11/12/2011 - 09:35

Poradnik trochę krótki, mógłbyś dodać jeszcze formatowanie tekstu, czyli kolorowanie tekstu, wielkość czcionki itp. Ogólnie w porządku.

#12 Austin

    Początkujący

  • Użytkownik
  • PipPip
  • 12 postów

Napisano 11/12/2011 - 15:17

Jak dla mnie .. świetny poradnik, czekam na więcej :)

#13 ownede

    Początkujący

  • Użytkownik
  • PipPip
  • 17 postów

Napisano 11/12/2011 - 18:23

Wyświetl postUżytkownik Le Kaczorek dnia 11/12/2011 - 00:49 napisał

ownede, a co chcesz mistrzu zastosować w htmlu do wyśrodkowania? :X
CSS. Tag 'center' został wycofany już w HTML4, teraz rynek przejmuje HTML5 :)

Dobrze, że zwracasz się do mnie jak powinieneś.

#14 Krzysztof Baraniak

    Zakorzeniony

  • Administrator
  • PipPipPipPipPip
  • 174 postów
  • Miasto:Leszno

Napisano 11/12/2011 - 18:37

Wyświetl postUżytkownik ownede dnia 11/12/2011 - 18:23 napisał

Dobrze, że zwracasz się do mnie jak powinieneś.

Dołączona grafika

Dołączona grafika


#15 Kamil.K

    Zakorzeniony

  • Użytkownik
  • PipPipPipPipPip
  • 109 postów
  • Miasto:Gdańsk

Napisano 11/12/2011 - 20:41

@up
Też mnie to rozwaliło ;]

#16 Slider

    Nowy

  • Użytkownik
  • Pip
  • 7 postów

Napisano 01/03/2012 - 19:36

Wyświetl postUżytkownik ownede dnia 11/12/2011 - 18:23 napisał

CSS. Tag 'center' został wycofany już w HTML4, teraz rynek przejmuje HTML5 :)

Zależy o co dokładnie chodzi, wystarczy:"margin: 0 auto" lub "text-align:center" - zależy o co chodzi.





Użytkownicy przeglądający ten temat: 1

0 użytkowników, 1 gości, 0 anonimowych