Как да направите уебсайт, част 2, пълен сайт, направен от 0 в HTML, CSS с галерия с изображения - видео урок

Този урок описва сайт с помощта на HTML и CSS, която обхваща всички етапи: изработка на уеб сайт,
създаване на профил на безплатен хостинг и накрая качване на файлове в нашия сайт на тази хостинг, безплатен хостинг е бърз метод за поставяне на интернет страницата ни онлайн в рамките на няколко минути, в ущърб на този метод е, че ще имаме някои реклами, показвани на всички времена в горната част (заглавният горе).

Всеки, който иска да се отвори един сайт, което трябва да знаете HTML и CSS, не е нужно да си експерт в HTML (Hyper Tвътр MArkupe Language), но известна информация за кода е абсолютно необходима за разбирането на това как работят тези неща.

Дори и да се изгради един сайт, вие все още трябва да има никаква представа за това, което се случва през тези файлове ще изисква периодична корекция на грешки или постигане на промени.

Много хора бягат от код, много оприличават код на йероглифи, изобщо не е така, някой веднъж каза: „КОД Е ПОЕЗИЯ“, той беше прав, когато видите, че нещо се ражда от поредица от редове код, чувствате се прекрасно, изграждате виртуален свят само с клавиатура и мишка.

Използвахме приложения, изградени от софтуерни компании от много време, ние само работехме с компютър, време е да правим програмиране, всъщност това не е език за програмиране, той е „език за маркиране“, но ще се позоваваме на това е като език за програмиране, тъй като звучи доста странно "език за маркиране", HTML е един от най-лесните езици за програмиране (маркиране), използвани в наши дни, виждаме HTML на всеки сайт, много софтуер има в Те са компоненти на HTML, този език за програмиране е навсякъде, време е да го научите.

Първият път, може да бъде по-малко трудна, но ако сте внимателни, отколкото вие ще разберете веднага, че не всичко е толкова трудно са прости и красиви неща, ние създаваме нещо с ръцете ни, че това е най-важното нещо.

Ние ще се научат основите, а след това ние се учим как да въведете текст в уеб страница, то ние ще организира и ще оцвети текста, ние използваме CSS страница стил (Cascading Style Sheets), с която ще поставим всички елементи на страницата HTML изобщо, така че ще пусне на нашия сайт е направен да изглежда като едно цяло парче.

Ще научите прости техники, основно HTML и CSS, въпреки че това са основните неща в HTML и CSS, ще се създаде общ преглед приятно.

За този урок трябва да се въоръжиш с внимание и търпение, този урок не е нещо, което може да си позволи да продължим малко, ако превъртане няколко секунди може да пропуснете нещо много важно и ще видите след това вече не е имало смисъл, концентрация информацията е изключително висока и това е защо аз ви моля да бъде много, много внимателни.

След този урок, дори и интензивен курс бих казал, че ще имате по-добра представа какво HTML и CSS, можете да контролирате кода добре и напълно разбирате HTML документ, чувството, че HTML не е само набор от heroglife ще се разсее, вие знаете какво е, когато търсите в един HTML или CSS един.

Ние ще се запознаят с тагове (етикети), което имаме тук някои примери за етикети (тагове), които можете да използвате в HTML документ, не се притеснявайте, не е нужно да ги запомня всичко, което трябва да се научи само на основите в първата таблица останалата част може да се намери тук в сайта или в мрежата, когато имате нужда от тях.

Дори и масите са подредени тези тагове, са направени с помощта на HTML.

Основни елементи (тагове).

Определя файлов формат Web а
удар с глава на документ
документ Tilul
HTML страница тяло
BGCOLOR = цвят Цветът на фона на страницата
ТЕКСТ =цвят Цвят на текста на страницата
LINK =цвят Цвят на страница непосетени връзка
VLINK =цвят Посетена цвят линк на страницата
ALINK =цвят Link Color време exacutat на кликване на потребителя
Предшестващо = URL страница фоновото изображение
параграф
<Hn> <Hn> Подзаглавието на нивото на документ (n = 1-6)
Специфични характеристики на текста в рамка
SIZE =n размер на текста е 1-7
FACE =„A, b“ Посочете шрифта: aАко е възможно, или b
COLOR =s Цвят на текста: или име на цвета или на стойност RGB
нов ред
информация предварително форматирани
HTML Comenatriu
Материал центрове в страницата
хоризонтална линийка
SIZE =x височина Ruler в пиксели
WIDTH =x ширина Ruler в пиксели или проценти
NOSHADE Изключване на дисплея на сянка за хоризонталната линийка
ALIGN =x Alignment хоризонтална линийка на страницата (ляво, център, дясно)
COLOR =x Цвят хоризонтална линия (само за Internet Explorer)
Марк тип котва
HREF =URL референтен хипертекст
HREF =#name Позоваване на вътрешен котва
Име =име Определението на вътрешни котви

Предмети на списъци .

Описание дефиниция
определение тип Списък
В рамките на дефиниция
Списък с функции
<OL Подреден списък (номериран)
TYPE =тип Номерирането. Възможни стойности: A, а аз, аз, 1
START =x Броят на започна нареди списъка
<UL Неподреден списък (маркирани)
TYPE =форма Форма маркер. Възможни стойности: кръг, квадрат, диск.

форматиране на символи елементи .

Поставяне на текст с удебелен
Поставяне на текст в курсив
Paste подчерта текст
Непропорционални текст на шрифта
цитиране bibliogarfica
програма обява
Стил Отбелязването логика
Текст клавиатура
Отбелязването силна логика
Програма или променлива
<ОСНОВЕН ШРИФТ SIZE = n> Определя размера на шрифта по подразбиране на страница

Елементи за дограма .

Определяне страница писане
COLS =x Броят и относителният размер на колоните
ROWS =x линии размерът на брой и относителен
ГРАНИЦА =x Указва състоянието „включено“ или „изключено“ за кадър FRAMESET (1 или 0)
зададения x Определя размера на рамката
FRAMESPACING = x Размерът на пространството между две съседни рамки
Определението на конкретна рамка
SRC =URL URL източник за рамката
NAME =име Име на рамката (използва се заедно с TARGET = име като част от котвата
Превъртане =SCRL Определете опция бар derulare.Valori възможно: (Активиране), на разстояние (неактивни), автоматично (автоматичен)
зададенияx Размерът на границата около рамката
marginheight =x В допълнително пространство над и под определена рамка
marginwidth =x Suplimetar пространство наляво и надясно за конкретна
Раздел страница показва на потребителите, които не могат да видят кадър
Рамковата (само (IE)
SRC =URL източник кадър
NAME =s Името на прозорец (полезен за TARGET)
ВИСОЧИНА =x Embedded височина на рамата
WIDTH =x Embedded ширина кадър

Елементи за маси .

HTML маса
ГРАНИЦА =x граница на маса
cellpadding =x Допълнителното пространство в рамките на клетките на таблицата
cellspacing =x Допълнителното пространство между клетките на таблицата
WIDTH =x Наложени ширина на маса
FRAME =на стойност Фина настройка на таблицата
ПРАВИЛА =на стойност Линейки глоба трапезни корекция
BORDERCOLOR = цвят Спецификации Таблица граничен цвят
BORDERCOLORLIGHT = цвят Запалката цвета на двата цвята посочено
BORDERCOLORDARK = цвят По-тъмния цвят на двата цвята посочено
ALIGN =наляво Подравнява таблицата към лявото поле на страницата, и текстът се влива в дясната зона на
ALIGN =прав Подравнява масата до десния край на страницата и на текста, протичащ в ляво
hspace =x Suplimetar хоризонтално пространство около масата
vspace =x Suplimetar вертикално пространство около маса
COLS =x Определя броя на колоните на таблицата
Определя набор от дефиниции на колони с помощта на маркиране
<COL WIDTH =x> Определя ширината на колона в пиксели
Определя заглавието на таблицата
Определя тялото на маса
маса Line
BGCOLOR =цвят Задава цвета на фона на цялата линия
ALIGN =подравняване подравняване Cell на текущия ред (от ляво, център, дясно)
клетка на данни от таблицата
BGCOLOR =цвят Задава цвета на фона на данните за клетка
ColSpan =x Броят на колоните, които обхваща настоящата данни клетка
rowspan =x Броят на линиите, простиращи текущата данни клетка
ALIGN =подравняване Подравняване на тъканта на клетката date.Valori възможно: (ляво, дясно, център)
VALIGN =подравняване Вертикално подравняване на материала от клетката date.Valori възможно: (горе, долу, в средата)
Предшестващо =URL Задава фоновото изображение за клетката на маса
noWrap Да не се допуска разделяне на реда текст в рамките на една клетка
ALIGN =изходно ниво Изравнете клетки данни към базовата линия на съседния текст
ALIGN =характер Приравнява колона към конкретен символ (символът по подразбиране е ".")
ALIGN =оправдае Изравнете както в левия край и десния край на текста

Опции за добавяне на изображения.

<IMG Маркиране входни изображения
SRC =URL графичен Source File
ALT =текст Алтернативен текст, за да се покаже, ако е необходимо
ALIGN =подравняване Подравняването на снимката на страницата. Възможни стойности: топ (горе), в средата (в средата), дъно (по-долу), наляво (вляво), право (вдясно)
ВИСОЧИНА =x Височина на изображението (в пиксели)
WIDTH =x ширината на изображението
ГРАНИЦА =x Рамката около изображението, когато се използва като препратки
hspace =x Допълнителното пространство около изображението хоризонтално (в пиксели)
vspace =x Допълнителното пространство около изображението вертикално (в пиксели)

Образува елементи.

Active HTML форма
ДЕЙСТВИЕ =URL CGI програма на сървъра, който получава данни
МЕТОД =метод Как данни се предават към сървъра (GET или POST)
<ВЪВЕЖДАНЕ Camp текст или друго въвеждане на данни
TYPE =опция Тип поле за въвеждане . Възможни стойности: текст, парола, квадратче за отметка, скрито, файл,
Радио, представи, нулиране, изображение.
NAME =име Полето символична стойност име
СТОЙНОСТ =на стойност текстово поле Content подразбиране
CHECKED = опция Бутон / квадратчето маркирана по подразбиране
SIZE =x Броят на символите в текстово поле
SIZE =x Максималният брой символи позволено
отметки Група
NAME =име Полето символична стойност име
SIZE =x Броят на елементите от менюто, които се показват, след като (по подразбиране = 1)
ЕДИН =x Позволява многократно избор на елементи от менюто
<ОПЦИЯ Специален избор в дадена област
СТОЙНОСТ =на стойност Получената стойност на това меню за избор
Camp армировка текст на няколко линии
NAME =име Полето символична стойност име
ROWS =x Броят на линиите на текстово поле
COLS =x Броят на колони (знака) на ред на текстово поле
Споделете логическа форма в части
Наименование, свързано набор от полета (fieldsets)
ALIGN =s Посочете легендата подравняване (обяснение), показани (горе, долу, ляво, дясно)
tabindex =x Посочете елементите на ред, когато потребителят натисне клавиша Tab
ACCESKEY =c Която осигурява специфичен ключ от клавишната комбинация, свързани с дадена точка
С уВРЕЖДАНИЯ Елементът е неактивна, но се показва на екрана
само за четене Елементът се показва на екрана, но не може да се редактира

Разширено елементи.

Конкретна информация за модела стилове
TYPE =вълна Видът на моделния стил. Обикновено "text / css"
Обикновено включва скрипт Javascript във вашата уеб страница
ЕЗИК =език Езикът, използван
EVENT =събитие Събитие, което води до изпълнение на специфични скриптове
ЗА =numeobiect Име страница, на която действа скрипт

ИЗТЕГЛЯНЕ HTML МАСИ с етикети

Ако искате да посетите, проведено сайт урока, можете да получите достъп до този адрес: http://www.videotutorial.150m.com.

Препоръчвам ви отварям прикачения файл и проучване на трите файлове HTML или CSS файл, използвайки Notepad ++ или друг уеб страници програма за редактиране по този начин може да направи промени ОКА дори могат да направят бележки по време на нея ще научите HTML, без да сте акаунт.

Вие желаете приятна и ви приветствам в следните уроци в тази серия и след това.

Изтегляне на файлове TEST

от Дан Constantin
tutorialegimp.blogspot.com
Cristian Cismaru: Харесва ми всичко, свързано с IT&C, обичам да споделям опита и информацията, които трупам всеки ден. Уча се да те уча!

Вижте Коментари (333)

  • Много хубаво, тонове информация в този урок.
    Този урок може да се нарече инфузия на HTML и CSS.
    Може би не се получи, за да научат за няколко месеца може да научите тук в един час, или така, аз съм го виждал преди да бъде публикуван и може да се каже, че ме впечатли цитирам информация може да се побере в един урок.
    В един момент се почувствах необходимостта да се пие вода, макар че аз само наблюдаваше урока, нито пък искам да мисля, цитирайки Дан пих вода след това.
    Има нещо, което не трябва да се научи HTML и / или CSS след този урок.

  • Аолеу, това, което се опитвам да науча от около 3 месеца, явно нямам време ...
    Благодаря много, аз го гледам внимателно!

  • Кристи-администраторМного хубаво, тонове информация в този урок.
    Този урок може да се нарече инфузия на HTML и CSS.
    Може би не се получи, за да научат за няколко месеца може да научите тук в един час, или така, аз съм го виждал преди да бъде публикуван и може да се каже, че ме впечатли цитирам информация може да се побере в един урок.
    В един момент се почувствах необходимостта да се пие вода, макар че аз само наблюдаваше урока, нито пък искам да мисля, цитирайки Дан пих вода след това.
    Има нещо, което не трябва да се научи HTML и / или CSS след този урок.

    да, ти си прав Кристи, но съм разочарован, защото мислех, че ще направиш урока :( но така или иначе браво дан много добър урок

    • Не е хубаво какво казахте и честно ви го казвам, този човек се бори около час и половина, за да ви научи как да направите сайт от нулата и казвате, че сте разочарован, защото той не го направи? Можете ли да си представите колко работа е вложил човек и колко време е загубил, за да ни научи на основите на html и css, помислете, преди да отворите устата си, че не би било подходящо да подадете работа и след това оставете други ненужни коментари, като напр. разочаровани сте, че той не е сложил, някой друг е създал този урок, благодаря, че имате къде да се научите;)

  • клюн:
    Кристи да, прав сте, но аз съм разочарован, защото вярвах, че ще направите tutorialu но така или иначе дан Браво много добра tutorialu

    Какво мислите, че поредицата за „Как да направите сайт“ приключи.
    В следващия урок ще бъда аз.
    Защото това, което на следващия урок ще трябва да се гледа този урок, проведено от Дан.
    Това, което представяме, е различен от начинаещи Направих аза Дан, но информацията в нея ще бъде необходимо за правилното разбиране на нещата.
    Има няколко начина за публикуване на съдържание в мрежата, но всички те имат общ знаменател, HTML и CSS, без да ги не можеш да направиш нищо.

  • Кристи-администратор:
    Какво мислите, че сложи край на серията на "Как да направите уеб сайт".
    В следващия урок ще бъда аз.
    Защото това, което на следващия урок ще трябва да се гледа този урок, проведено от Дан.
    Това, което представяме, е различен от начинаещи Направих аза Дан, но информацията в нея ще бъде необходимо за правилното разбиране на нещата.
    Има няколко начина за публикуване на съдържание в мрежата, но всички те имат общ знаменател, HTML и CSS, без да ги не можеш да направиш нищо.

    Здравейте Кристи, ще дойде серия от PHP или JS?

  • Alex:
    Здравейте Кристи, ще дойде серия от PHP или JS?

    Ние говорим за всичко, но също така и PHP и JS сайт се свързва с HTML, HTML не може да бъде без.
    PHP се използва повече за извличане на данни от бази данни, уеб страниците все още са на HTML, независимо дали говорим за динамични сайтове (php, dhtml, asp, jsp, cf) или говорим за статичен сайт, ще използвайте HTML, нищо не може да се направи без него.
    Много хора правят голяма грешка „вече не искам HTML сайт, искам динамичен php сайт“, това е голяма грешка, HTML се използва почти навсякъде, независимо дали говорим за динамични сайтове или статични сайтове.
    JS (Java Script) не е същото с JSP (Java Server Pages), която зависи от сървъра, JS сайтове се използват за някои скриптове, няма нужда от никакви сървърни скриптове JS могат да работят във всеки браузър, без да е необходимо компонент на сървъра, и в този урок, Дан използва серия от скриптове JS (фотогалерия), да неща точни употреби JS, не съществуват пълни сайтове с JS вместо са пълни сайтове, използващи Java Server Pages, че е нещо друго, въпреки че те изглеждат еднакви.
    Знам, че сте започнали да изучавате „кода“ преди много време, този урок е отлична помощ, Дан направи изключително нещо с този урок, дори не осъзнавате колко е ценен този урок, под урока имате почти всички тагове ), използвани в HTML, можете да ги използвате, особено след като всеки от тях има описание.
    Не позволявайте на ALEX, почивка код, то се основава.
    Повярвайте ми, не липсва за потенциални!

  • уау много много добре структурирана информация, така че всеки да може да разбере. Аз лично погледнах ръководството само с цел да открия нещо ново и с напредването на урока бях изумен колко лесно може да се направи сайт, не твърде зареден и много приятен за гледане. Поздравления за този урок, но и за всички останали. Очаквам с нетърпение следващото "вливане" (думите на Кристи) с информация.

  • Честито!! Много хубав урок, това ще бъде Румъния, пълна с уеб дизайнери :) (дано !!)

  • Това ще бъде един урок Dreamweaver? Dc не използвате Dreamweaver или във вашите уроци?

    Поздравления за всички уроци ... ти си най-силният;)

  • Здравейте..урокът е наистина страхотен, има "тонове" информация ... и мисля, че трябваше да науча основния html в първа страница 98 ", правейки десетки тестове, взети от книги в библиотеката, защото нямах нето по това време и сега мога да гледам урок, в който се обяснява всичко, което трябва да знам .. ясно е, че съм се развил :))) .. хареса ми факта, че беше обяснено стъпка по стъпка и че те бяха поставени на сайта всички основни команди + пример, с който може да се работи .. ясно е, че знаеш какво правиш, ти си истински учители !!
    И все пак много от тези, които работят в областта на уеб дизайна с помощта на програми, които автоматично правят поръчки и въпроса ми е, ще ви направи един урок с такава програма ??
    Знам, че сте направили този урок за разбиране на командите и по този начин за по-добро разбиране на програмите за уеб дизайн ... но все още ми е любопитно да видя какво ще продължите с тази поредица от уроци, защото има много разговори по тази тема, дори ако някои я смятат скучно, когато става дума за уроци като този, направен от Дан, който поздравявам по този повод за урока ...

Свързани Post

Този сайт използва бисквитки.