Бергон интернет и телевизия
http://forum.bergon.net/

HTML уроци
http://forum.bergon.net/viewtopic.php?f=21&t=6573
Страница 1 от 6

Автор:  m1t3 [ 07 Апр 2005 22:06 ]
Заглавие:  HTML уроци

Така първо започваме със "скелета" HTML koдa
HLML се пише на Notepad
ето го и "скелета" HTML


<html>
<head>
<title>тук се пише заглавието на страницата</title>
</head>
<body bgcolor="pink"> тук може да се напише и друг код за фон на страницата но на англииски</body>
</html>

след като запазите фаила променете името му на ime.html

Автор:  Reborn [ 07 Апр 2005 22:27 ]
Заглавие: 

Какво е HTML?(май много питам :) )

променено от m1t3 от US на кирилца

Автор:  m1t3 [ 07 Апр 2005 22:31 ]
Заглавие: 

4есто използвани HTML tagove
таг е спецялен HTML код ограден s <> използван за задаване на различни команди.Много от таговете използвани в HTML са двоини и се състоят от стартов таг и завършващ таг (пример <b> </b>

<html></html> индефицира документа като HTML
<head></head> индефицира заглавната част на HTML документа
<body></body> индефицира тялото на HTML документа
<title></title> обособява заглавието на HTML документ
<h1></h1>....<h6></h6> задава размера на текста до 1 от предварително обусобение 6 размера
<p></p> обособява абзац в текста
<b></b> удебелва текста
<i></i> прави текста курсив
<u></u> подчертава текста
<img> поставя изображение в страницата
<a> задава хиперлинк
<br> поставя краи на ред
<ul></ul> обособява списък от пунктове
<ol></ol> обособява списък от номерирани пунктове
<li></li> обособява пункт в всякъкав вид списък

Автор:  Mr_Smith [ 07 Апр 2005 22:31 ]
Заглавие: 

e m1t3 ти добре даваш notepad, щото има някои неща като translatorite не могат, ама да дадеш малко lessons за dremaweaver, щтото сякаш е по лесно и скелета е автоматичен:)

не казвам че темата е тъпа, напротив, ама ме съмнява някои да тръгне да си играи дапише в notepad примерно за да вкара един.jpg като може с 2-3 клика :)

променено от m1t3 от US на кирилца

Автор:  m1t3 [ 07 Апр 2005 22:31 ]
Заглавие: 

archangel написа:
kakvo e HTML?(mai mnogo pitam :) )

HTML е офицялният език в уебстраниците и означаваHypertext Markup Language (hipertekstov ezik za markirane)

променено от m1t3 от US на кирилца

Автор:  m1t3 [ 07 Апр 2005 22:36 ]
Заглавие: 

martin написа:
e m1t3 ti dobre dava6 notepad, 6toto ima nqkoi ne6ta koito translatorite ne mogat, ama da dade6 malko lessons za dremaweaver, 6toto sqka6 po-lesno i skeleta e auto :)

ne kazvam 4e temata e typ, naprotiv, ama me symnqva nqkoi da trygne da si igrai da pi6e v notepad primerno za da fkara edin .jpg kato moje s 2 3 click-a :)

нека първо се представи основния начин пък те програмките са лесна работа
променено от m1t3 от US на кирилца

Автор:  Mr_Smith [ 07 Апр 2005 22:38 ]
Заглавие: 

m1t3 кажи таг за цветни scrolbar-i :)
променено от m1t3 от US на кирилца

Отговор от м1т3:Тоя таг не го знам за съжаление помня че го учих ама съм го забравил :(

Автор:  m1t3 [ 07 Апр 2005 22:39 ]
Заглавие: 

за да видите HTML кодо на дадена Уеб страница кликвате на view-source в internet експлорера
променено от m1t3 от US на кирилца

Автор:  m1t3 [ 07 Апр 2005 22:48 ]
Заглавие: 

добавяне на цвят:
команди :
-за цвят на страница -> bgcolor
-за цвят на текста-> text
бяло- white
4ерно-black
сребристо-silver
сиво-gray
червено кафяво-maroon
4ервено-red
зелено-reen
бледожълто-lime
тъмносинио-navy
синио-lue
тъмновиолетово-purple
лилаво-fuchsia
малинено зелено-ive
жълто-yellow
тъмнозелено-teal
морско синио-aqua

ПРИМЕР:
<body bgcolor="silver" text="navy">

Автор:  m1t3 [ 07 Апр 2005 22:57 ]
Заглавие: 

Атрибутът е опция на таг която позволява да осигурите детаили за начина по които тагът влияе на съдържанието

ПРИМЕР:
Един добър пример за необходим атрибут е SRC които е част от тага за изображение <IMG>
Критична 4аст от разполагането на изображение е посо4ването на фаила на изображението и това се задава в атрибута SRC

<img src="ime.jpg">
<img src="ime.bmp">
.
.
.

Автор:  m1t3 [ 07 Апр 2005 23:03 ]
Заглавие: 

съшто така може да контролирате изображението спрямо съседния текст като използвате атрибута ALIGN

Primer:
<img src="ime.jpg" align="top"

Автор:  m1t3 [ 07 Апр 2005 23:09 ]
Заглавие: 

ето начин да слочим снимка с линк към e-maila или уеб страницата ви:

<p>
<img src="m1t3.jpg" align="top">
This is the personal web page of M1T3 . Click
<a href="mailto:m1t3@abv.bg">here</a> to e-mail m1t3.
</p>

Автор:  NightCrawler [ 07 Апр 2005 23:11 ]
Заглавие: 

ето и от мен нещо как да си вкарам музика(като отвориш страницата да ти свири музика)

За да включите този файл като музикален фон в Internet Explorer трябва да използвате елемента <BGSOUND> в главата <HEAD>. Като атрибут на <BGSOUND> за указване на пътя до музикалния файл се използва SRC .

<HTML>
<HEAD>
<TITLE>music</TITLE>
<BGSOUND SRC="ТУКа се пише адреса на мелодията" LOOP="-1">
</HEAD>
<BODY>
</BODY>
</HTML>


Разбира се, ако файла се намира във вашата директория на сървъра не е нужно да указвате целия път, а само да напишете <BGSOUND SRC="music.mid" LOOP="-1">. Атрибута LOOP задава броя на повторенията на мелодията. Когато LOOP="-1" тогава мелодията започва отново, веднага след като свърши. Ако искате да се повтори два пъти например и после да спре, трябва да зададете LOOP="2". Netscape Navigator не разпознава елемента <BGSOUND>.


използват се музикални формати mid и wav иначе не става

Автор:  NightCrawler [ 07 Апр 2005 23:15 ]
Заглавие: 

за да си сложите меню във страничката копнете това в главата <HEAD>


<style>
.menulines{
border:1px solid white;
}

.menulines a{
text-decoration:none;
color:black;
}
</style>

<script language="JavaScript1.2">

function borderize(what,color){
what.style.borderColor=color
}

function borderize_on(e){
if (document.all)
source3=event.srcElement
else if (document.getElementById)
source3=e.target
if (source3.className=="menulines"){
borderize(source3,"black")
}
else{
while(source3.tagName!="TABLE"){
source3=document.getElementById? source3.parentNode : source3.parentElement
if (source3.className=="menulines")
borderize(source3,"black")
}
}
}

function borderize_off(e){
if (document.all)
source4=event.srcElement
else if (document.getElementById)
source4=e.target
if (source4.className=="menulines")
borderize(source4,"white")
else{
while(source4.tagName!="TABLE"){
source4=document.getElementById? source4.parentNode : source4.parentElement
if (source4.className=="menulines")
borderize(source4,"white")
}
}
}

</script>

Сега сложете между <BODY> и </BODY> следващия код:

<table border="0" width="200" cellspacing="0" cellpadding="0" onMouseover="borderize_on(event)" onMouseout="borderize_off(event)">

<tr><td width="100%" bgcolor="#CCCCFF"><b>Меню</b></td></tr>

<tr><td width="100%" class="menulines"><small><a href="http://линк1">Линк 1</a></small></td></tr>

<tr><td width="100%" class="menulines"><small><a href="http://линк2">Линк2</a> </small></td></tr>

<tr><td width="100%" class="menulines"><small><a href="http://линк3">Линк3</a> </small></td></tr>

<tr><td width="100%" class="menulines"><small><a href="http://линк4">Линк4</a></small></td></tr>

<tr><td width="100%" class="menulines"><small><a href="http://линк5">Линк5</a> </small></td></tr>

</table>

Автор:  NightCrawler [ 07 Апр 2005 23:17 ]
Заглавие: 

следващото което ви показвам е часовник в статутбара


Копирайте долния javascript код някъде между <HEAD> и </HEAD> в страницата си и ще получите един полезен часовник в статусбара.

<SCRIPT LANGUAGE="JavaScript">
<!--

var hours;
var minutes;
var seconds;
var CurrentTime;

function update () {
time = new Date ();
hours = time.getHours ();
minutes = time.getMinutes ();
seconds = time.getSeconds ();

if (hours < 10) {
CurrentTime = "0" + hours;
} else {
CurrentTime = hours;
}

if (minutes < 10) {
CurrentTime += (":0" + minutes);
} else {
CurrentTime += (":" + minutes);
}

if (seconds < 10) {
CurrentTime += (":0" + seconds);
} else {
CurrentTime += (":" + seconds);
}

if (window.status != CurrentTime) {
window.status = CurrentTime;
}

updt = window.setTimeout ("update ()",100);
}

update ();

// -->
</SCRIPT>

Автор:  m1t3 [ 07 Апр 2005 23:22 ]
Заглавие: 

Представям ви 1 примерна страница , примерите оцветени в синю могат да се заместят с персонални настроики.

<html>
<head>
<title>m1t3's personal page</title>
</head>

<body bgcolor="silver" text="navy"
<h1>m1t3 the kid</h1>
<p>
<img src="m1t3.jpg" align="top">
This is the personal web page of m1t3 the kid.Click
<a href=:mailto:m1t3@abv.bg">hire</a> to e-mail m1t3.
</p>
<p>
these are some of m1t3's face parts:
<ul>
<li>blue eyes</li>
<li>blond haer</li>
<li>long nose</li>
</ul>
</p>
</body>
</html>

Автор:  m1t3 [ 08 Апр 2005 07:51 ]
Заглавие: 

В HTML за да започнете на нов ред ви трябва тагът <br> поставен в края на изречението след което се започва на нов ред.

Primer:
<html>
<head>
<title>...</title>
</head>
<body>
Tova izre4enie trqbva da e na otdelen red.
<br>
Tova izre4enie sa6to se nujdae ot prostranstvo
</body>
</html>

Докато тагът <br>показва че трябва да се започне на нов ред то тагът <p> оформя цял абзац

ПРИМЕР:

<html>
<head>
<title>...</title>
</head>
<body>
<p>
Tova e nov abzac.
</p>
<p>
S tova izre4enie zapo4va nov abzac
</p>
</body>
</html>

Автор:  m1t3 [ 08 Апр 2005 08:02 ]
Заглавие: 

[url]align[/url] е най-често ползваният атрибут за подравняване той се задава с 1 от следните стоиности:

вече видяхте TOP

LEFT - подравнява текста на абзаца в ляво
RIGHT-подравнява текста на абзаца в дясно
CENTER-центрира текста на абзаца


Ето 1 пример как да се центрира ред от текст, като се използва атрибутът [url]align[/url] в тага [url]<p>[/url]

Пример:
<p align="center">
Този текст е центриран в станицата
</p>

Това е само откъс HTML код !

Автор:  m1t3 [ 08 Апр 2005 08:10 ]
Заглавие: 

Атрибутът align сигурно ще предизвика въпрос: КАКВО СЕ СЛУЧВА АКО НЕ СЕ ЗАДАДЕ АТРИБУТ?
отговор:атрибутите които не са задължителни имат подразбизащи се стоиности.

В случая атрибутът ALIGN подразбиращата се стоиност е LEFT ето защо абзаците в текст са лявопосочени освен ако изрично не ги подравните другаде


Тагът <div> е подобен на тагът <p> макар тои да е по-общ.Тагът <div> се използва за заделяне на HTML документ секции и изгае пове4е организационна роля в сравнение с <p>.
повече за <div> пo късно.

Автор:  m1t3 [ 08 Апр 2005 08:23 ]
Заглавие: 

ФОРМАТИРАНЕ НА ТЕКСТ

заглавни тагове-те обособяват заглавията на секциите в HTML документ (използват се за определяне големината на текста)

[url]тези тагове са 6 : <h1><h2><h3><h4><h5><h6>[/url]
съкратеното H1 означава HEADING ONE.

Пример за използването на заглавните тагове:
<body>
<h1>tuk pi6ete text s opredeleniq razmer</h1>
<h2>tuk пи6е се текст с опеределения размер</h2>
<h3>tuk пи6е се текст с опеределения размер</h3>
<h4>tuk пи6е се текст с опеределения размер</h4>
<h5>tuk пи6е се текст с опеределения размер</h5>
<h6>tuk пи6е се текст с опеределения размер</h6>


ето така изглежда :
http://freeftp.bergon.net/rack5/users/m1t3/HTML/big%20bukvi.html

Автор:  m1t3 [ 08 Апр 2005 08:29 ]
Заглавие: 

ето още 2 тага за оформяне:

<em></em>-добавя наблягане върху текста
<strong></strong>-добавя силен акцент към tekst


ПРИМЕР:

<p>
The collapse of the market came as an <em>enormous</em>
surprise to may and delivered a <strong>chushingg</strong>
blow to many individual portfolios.
</p>

Ето го резултата:
http://freeftp.bergon.net/rack5/users/m1t3/HTML/6rift1.html

Автор:  uBauJlo [ 08 Апр 2005 12:02 ]
Заглавие: 

Имаше едба програма ама забраех как се казва май Tutor ама незнам ше я видя.Аз кат почнах да уча HTML с таз програма почнаха да ме учат мНооГо е полезна

Автор:  m1t3 [ 08 Апр 2005 12:05 ]
Заглавие: 

Ето тук прилагам няколко HTML тага за форматиране базирано на съдържание заедно с кратко описание:

<cite> - задава библиогравски цитат, като например заглавие на статия от книга или списание.
<code> - Задава код с еднакво разтояние между буквите
<dfn> - Задава дифиниции като такива които се срещат в онлаин речник
<kbd> - посочва текст които се въввежда от клавиатура
<samp> - задава поредица от буквени символи
<var> - указва на променливи в код

Всички тези тагове изискват както стартиращ така и завършващ таг ограждащи текстовото съдържание

(ako ne razbirate ne6to v obqsneniqta za tagovete spoko kato po4nat primerite 6te vi se izqsni koi kakvo pravi)

Автор:  m1t3 [ 08 Апр 2005 12:22 ]
Заглавие: 

Физическо форматиране на текст
Ето кои са таговете за Физическо форматиране заедно с кратки описания:


<b.> - задава удебеляване на текста(bold)
<big> - увеличава размера на буквите от подразбиращия се
<blink> - задава мигащ текст
<i.> - задава курсив на текста (italics)
<s> - задава зачертаване на текста
<small> - Намалява размера на буквите от подразбиращия се.
<sub> - задава долен индекс
<sup> - задава горен индекс
<tt> - задава шрифт с еднаква ширина набуквите
<u.> - задава подчертаване на текста (underline)




Тези тагове изискват стартиращ и завършващ таг които да обграждат текстовата фраза

Пример:
<html>
<head>
<title>..</title>
</head>
<body>
<p>
when I was <small><small>smaller</small></small> than I am now,
I dreamed of being much <big><big>Bigger</big></big>.As
<b.>excited</b> as I was about the prospect , the amout of time
it would take to get there made me <i.>sad</i>
</p>

Премахнете точките от <B.> , <I.> , <U.> сложих точките защото иначе форума приемаше таговете като команди

ето как изглежда:
[/url]http://freeftp.bergon.net/rack5/users/m1t3/HTML/text2.html[url][/url]

Автор:  m1t3 [ 08 Апр 2005 12:40 ]
Заглавие: 

Работа със списъци

Вище примера:
<html>
<head>
<title>..</title>
</head>
<body>
<p>
Най-извесните видове спорт:
<ul>
<li>Futbol</li>
<li>basketbol</li>
<li>hokei</li>
</ul>
</p>
</body>
</html>

Вище как изглежда от линка :

http://freeftp.bergon.net/rack5/users/m1t3/HTML/spisak1.html


Тагът <ul> поддържа тип атрибут които Ви позволява да промените вида на точката показвана пред всеки от пунктовете в списъка.С атрибута TYPE могат да се използват следните стоиности:
- Стоиността DISC задава плътен кръг
-стоиността CIRCLE задава празен кръг
-стоиността SQUARE плътен квадрат


Пример:
<ul type="disc">

Автор:  m1t3 [ 08 Апр 2005 12:50 ]
Заглавие: 

Поредният таг е <ol> тои създава поредни списъци от пунктовете.
Атрибутът TYPE задава системата за номериране :
1 - 1,2,3,4....
A - A,B,C,D...
a - a,b,c,d...
I - I,II,III,IV...
i - i,ii,iii,iv...

Пример: <ol type="A"
Друг атрибуте е start toi pozvolqva да посочите стартовата цифра или буква за списък. Пример: <ol type="A" start="3"> В този случай броенето започва от C

ОБЩ Пример:
<html>
<head>
<title>..</title>
</head>
<body>
<p>
най-известните видове спорт:
<ol type="A" start="1">
<li>Futbol</li>
<li>basketbol</li>
<li>hokei</li>
</ol>
</p>
</body>
</html>

Ето линк:
http://freeftp.bergon.net/rack5/users/m1t3/HTML/spisak2.html

Автор:  m1t3 [ 08 Апр 2005 13:08 ]
Заглавие: 

Дефиниционни списъци

Дефинационният списък се огражда от стартов и завършващ таг <dl>
а всяко понятие в списъка се обозначава чрез тага <dt>.Друг taг e тагът <dd> той следва тага <dt> в списъка за да осигури дифиницията на предшестващото понятие
Това може да звучи объркващо но е много просто вище примера:

<html>
<head>
<title>..</title>
</head>
<body>
<p>Following are a few technologies related to Web page
development , along with a brief description of each:
<dl>
<dt>Java</dt>
<dd>A programing language designed to add interactivity to Web
pages through special programs called applets that run within
the context of a page.</dd>
<dt>Javascript</dt>
<dd>A scripting language designed to add interactivity to Web
pages by embedding script code directly in HTML code,</dd>
<dt>VBScript</dt>
A scripting language that servers a similar role as\JavaScript ,
but that is loosely based upon Microsoft's popular
Visual Basic programing language.</dd>
</dl>
</p>
</body>
</html>

eто линк с готовия вариант:
http://freeftp.bergon.net/rack5/users/m1t3/HTML/spisak3.html

I sori ako imam gre6ki s angliiskiq

Автор:  m1t3 [ 08 Апр 2005 13:15 ]
Заглавие: 

Коментари
Коментарите в HTML кода индифицират информация която не е част от съдържанието на документа и не се обработва или показва .Коментарите се маркират със спецялен знак за коментар : <!-- и -->
Пример:
<!-- Да довърша това -->


Пример:
<html>
<head>
<title>..</title>
</head>
<body>
<!-- да заварша абзаца-->
<p>
It all began innocently enough in the fall of 1987...
</p>
<body>
</html>

Вище как изглежда на :
http://freeftp.bergon.net/rack5/users/m1t3/HTML/nz.html

Автор:  m1t3 [ 08 Апр 2005 13:22 ]
Заглавие: 

ВНИМАНИЕ
Koментарите могат да бъдат влагани 1 в друг!

Пример:

<!-- да довърш това<!-- Преди това да довърша онова --> и да си почина -->

Автор:  m1t3 [ 08 Апр 2005 14:53 ]
Заглавие: 

Форматиране на изображения
Както ве4е казах Картинка се вкарва в HTML документа с тага <img>
и задалжителния атрибут SRC но има и друг вайен атрибут : ALT
този атрибут се използва за присвояване на текст към изображение.

Пример: <img src="ime.jpg" alt="hire is me">

Пример:
<html>
<head>
<title>...</title>
</head>
<body>
<h2>zaglavie</h2>
<p>
texttexttexttexttexttexttexttexttexttexttexttexttexttext
texttexttexttexttexttexttexttexttexttexttexttexttexttext
</p>
<img src="ime.jpg" alt="text kam snimkata">
</body>
</html>

Ето тук линк
http://freeftp.bergon.net/rack5/users/m1t3/HTML/Vgrajdane.html

Страница 1 от 6 Часовете са според зоната UTC + 2 часа [ DST ]
Powered by phpBB® Forum Software © phpBB Group
http://www.phpbb.com/