Jak utworzyć prostą stronę internetową z html
W tym artykule powiemy Ci, jak utworzyć prostą stronę internetową za pomocą kodu HTML. HTML jest jednym z głównych elementów Internetu, ponieważ określa strukturę stron internetowych. Strona internetowa Możesz utworzyć w edytorze tekstu w systemie Windows lub MacOS.
Kroki
Część 1 z 6:
Jak dodać znacznik "głowy" (opis strony internetowej)jeden. Otwórz edytor tekstu. W systemie Windows uruchom notatnik lub notatnik ++, aw MacOS - Textedit:
- Windows - Otwórz menu Start



2. Wchodzić i naciśnij ↵ Enter. Poinformujesz więc przeglądarkę internetową, że jest to dokument HTML.

3. Wchodzić i naciśnij ↵ Enter. To jest otwarcie tagu kodu HTML.

cztery. Wchodzić i naciśnij ↵ Enter. Ten znacznik zawiera opis strony internetowej i elementów nagłówka. Zawartość tego znacznika na stronie zazwyczaj nie jest wyświetlana. Treści są opisem strony, metadanych, tabele stylów CSS i innych języków skryptowych.

pięć. Wchodzić . Ten znacznik zawiera nazwę strony.

6. Wprowadź nazwę strony. Wprowadź tekst, który ma być wyświetlany na karcie strony.

7. Wchodzić i naciśnij ↵ Enter. Ten znacznik zamyka znacznik nazw strony.

osiem. Wchodzić i naciśnij ↵ Enter. Ten znacznik zamyka znacznik opisu strony. Na tym etapie kod HTML powinien wyglądać tak.
Moja strona internetowa
Część 2 z 6:
Jak dodać znacznik "ciała" (wszystkie zawartość)jeden. Wpisz Tag pod tagiem zamykającym "głowa". Ten znacznik zawiera całą zawartość dokumentu HTML. Zawartość Ten znacznik jest wyświetlany na stronie internetowej.

2. Wchodzić . Ten znacznik zawiera tytuł strony. Tytuł jest dużym tekstem, który zwykle znajduje się na górze strony.

3. Wprowadź tytuł strony. Może to być nazwa strony lub powitania.

cztery. Wchodzić Po tekście nagłówka i kliknij ↵ Enter. Ta znacznik zamyka tag tytułowy.
Witam na mojej stronie!Mam na imię Max.Mam nadzieję, że nie będziesz nudny.

pięć. Wchodzić . Ten znacznik zawiera akapit tekstowy. Taki znacznik wyświetli tekst normalnego rozmiaru.

6. Wpisz tekst. Na przykład wprowadź opis strony internetowej lub inne informacje.

7. Wchodzić Po tekście i kliknij ↵ Enter. Ta znacznik zamyka tekst akapitu tekstu. Poniżej znajduje się przykład akapitu w dokumencie HTML:
To jest pierwszy akapit.
Wieloryby - majestatyczne zwierzęta.
Tekst tekstowy Bold Podręcznik Tekst podstawiający Wyściełany tekst
Część 3 z 6:
Jak dodać dodatkowe przedmiotyjeden. Dodaj zdjęcie na stronę. Dla tego:
- Wchodzić
. Ten tag zawiera zdjęcie.
- Skopiuj i wklej adres URL obrazu po znaku równości (=) w cytatach.
- Wchodzić > Po obrazie URL, aby zamknąć tag obrazu. Na przykład, jeśli obraz URL jest http: // Mój obraz.Com / Ocean.JPG, wprowadź następujący kod:
Src ="http: // Mój obraz.Com / Ocean.jpg">

2. Dodaj link do innej strony internetowej. Dla tego:
href ="https: // Ya.Ru"> Yandex.

3. Dodaj szczelinę ciągu. Aby to zrobić, wejdź
. Wstaw zostanie transfer rzędów. Ten znacznik można użyć do oddzielania różnych partycji strony.
. Wstaw zostanie transfer rzędów. Ten znacznik można użyć do oddzielania różnych partycji strony.
Część 4 z 6:
Jak zmienić koloryjeden. Skontaktuj się z oficjalną listą kolorów i ich kodów w kolorze HTML. World Consortium (W3C) prowadzi oficjalną listę kolorów, które można znaleźć w https: // W3.Org / Wiki / CSS / Właściwości / Kolor / Słowa kluczowe. Każdy kolor ma formalną nazwę, 6-cyfrowy kodeks szesnastkowy i dziesiętny. Możesz użyć dowolnego z tych parametrów, aby ustawić kolor elementów na swojej stronie. W tym przykładzie przyjmiemy oficjalne nazwy kolorów.

2. Ustaw kolor tła za pomocą tagu . Aby to zrobić, musisz dodać atrybut do tagu Styl. Załóżmy, że chcesz zrobić tło całej strony lawenda (Lavend):

3. Ustaw kolor tekstowy dla dowolnej tagu. Atrybut Styl Możesz także użyć, aby wskazać, jaki kolor cały tekst w określonym znaczniku. Na przykład, chcesz tekst w jednym z tagów Był Niebieska północ (Ciemny niebieski):

cztery. Ustaw kolor tła dla nagłówka lub akapitu. Tak jak określiłeś kolor tła dla tagu ciała, możesz wybrać kolory tła dla innych tagów. Na przykład, chcesz kolor tła Był Jasnoszary (jasnoszary) i kolor nagłówka nagłówka H1 - LightskyBlue (jasny niebieski):
Część 5 z 6:
Jak zamknąć kod HTMLjeden. Wchodzić , Aby zamknąć tag "ciało". Po zakończeniu dodawania tekstu, obrazów i innych elementów wprowadź określony znacznik na dole dokumentu HTML.

2. Wchodzić , Aby zamknąć kod HTML. Wprowadź ten znacznik pod oznaczeniem zamykającym "Ciało". Więc poinformujesz przeglądarkę internetową, która po tym tagu nie ma kodu HTML. Cały kod HTML musi być w przybliżeniu:
Strona wentylatora YandexPozdrowienia dla ciebie na mojej stronie"http: // Ya.Ru"> Yandex
Część 6 z 6:
Jak zapisać i otworzyć stronę internetowąjeden. Konwertuj dokument do normalnego tekstu (tylko dla użytkowników MacOS). Kliknij "Format" (na górze ekranu)> "Utwórz prosty tekst" (w menu rozwijanym).
Nie można tego robić w oknach.

2. Kliknij Plik. Ta opcja znajduje się w pasku menu na górze ekranu.

3. Kliknij Zapisz jako. Znajdziesz tę opcję w menu Plik.

cztery. Wprowadź nazwę dokumentu HTML. Wpisz go w ciągu "Nazwa pliku" (Windows) lub "Nazwa" (Mac).

pięć. Zmień format pliku za pomocą TXT na HTML. Dla tego:

6. Kliknij Zapisać. Ta opcja znajduje się na dole okna. Plik HTML zostanie utworzony.

7. Zamknij edytor tekstu. Teraz otwórz plik HTML w przeglądarce, w której można wyświetlić utworzoną stronę internetową.

osiem. Otwórz plik HTML w przeglądarce. Aby to zrobić, kliknij dwukrotnie plik HTML. Jeśli zostanie powiadomiony błąd, wykonaj następujące czynności:

dziewięć. Edytuj dokument HTML (jeśli jest to wymagane). Możesz zauważyć błąd na stronie. Aby go naprawić, wprowadzaj zmiany w zawartości pliku HTML:
Rada
- Możesz dodać pasek boczny tekstu przewijania za pomocą tagu
.Ale pamiętaj, że niektóre przeglądarki nie rozpoznają tego znacznika.
- Wiele osób używa notatnika ++ do napisania i skompilowania kodu.
- Każdy znacznik musi się zamknąć. Na przykład tagi
Powinien być zamknięty taki:.
- Aby wyjaśnić zdjęcie na stronie, wprowadź
Po nazwie obrazu w tagu "img" (na przykład,).
Ostrzeżenie
- Załaduj zdjęcia do Imgur lub podobne, jeśli zamierzasz je dodać do strony internetowej. Pamiętaj, że użycie zdjęć należących do innych osób narusza prawa autorskie.