Web Development Tutorial #1 Azhar Khaskheli
Hyper Text Markup Language
=============================================================================================================
Hello Guyz,
In this series we are going to cover html, css, javascript and finally Jquerry
I hope, ke aap already sb pta he ke ye sb kya hn kyu use krte hn,, so I wont revise them again.
Pr thora introduction deta chlnga,
Html ak markup language he jiski madad se hm webpages bnate hn,
HTML BUILDING BLOCK
Html ke document mn do sections hote hn, ak header section aur dsra body section, header section mn hm apne document ki
information describe krte hn ke ye ksne bnaya he kio bnaya he kb bnaya he etc etc, matlb ke all about our page,
Jabke body section mn hm lkhte hn ke hmare webpage m nasal mn kya he, mtlb ke sara content hm body section mn lkhte hn..
Html is compsed of tags, tags ko angular brackets mn band krte hn e.g. <html>, mtlb ke jo kch bh < > ke beech mn h, we can say ke
wo tag he,
Kch tags ase hote hn jn ko close bh krna prta he, pr kch tags ase hote hn jnko close krna lazmi nh,,
Jnko close krna lazmi hta he unhn hm paired tags kehte hn jese ke, <html> isko close krna lazmi hta he
<html> </html>
Aur jn tags ko close krna lazmi nh unhn hm singular tags kehte hn,
Lets Make a simple WebPage
Open note pad, and write this
Yahan sbse pehle hmne html ka tag shuru kya he aur finaly bnd kya he, html tag is used to
create html document.
Mtlb ke ye show krta he ke iske beech mn jo kch bh lkha he wo html ka document he,
As I said earlier ke html document mn do section hote hn ak header section aur dsra body
section , so lets create those two section in our webpage
So yhan dono section bn gae, so hmara ak simple webpage bn gya he, par ye webpage flhal
khali he kiok abh is mn hmne kch bh nh content nh dala he,,
So sbse pehl lets create heading in our web page
So yhan hmne ak heading lgai h1 tag se , aur yu can s
see ke h1 ko bad mn close bh kya he,,
<h1> tag is used to create heading
Now save this file, name koi bh de deejie pr final mn
.html lkhyega.. and run this webpage
So this was our simple web page, and basic building blocks and How to create a Webpage , I hope aapko sahee smjh aagya hga
Headings
Hmne ooper wale web page mn aik heading lgai thi, pr html hmn 6 headings deta he,, depending upon their sizes,,
Hmne jo ooper h1 lkhi wo sbse bri thi, isi tarah se h2 us se thri chhoti he, phr h3, and so on upto h6
Paragraph
Similarly yu can add paragraph, jese hr jagah heading ke neeche ak paragraph lkha hta he, to aap ye lga skte ho <p> tag se
Isko bh close krna prta he
Spaces
Suppose hm ak asa document bna rhe hn jhan hmne zyada spaces de di hn, to html use ignor kr dega
Par we want ke spaces hon,, to hm use krte hn
Breaking The Row
Suppose hm new line pe aaana chahte hn to hm <br> tag use krte hn, ye singular tag he to isko bnd krna lazmi nh
Formatting Tags
Formating tags are used to design the html, i.e.. how to bold, italic, underline etc.
Bold krne ke lye <b> ..</b> aur italic ke lye <i>… </i> underline ke lye <u> </u>, similarly dsre tags bh hm btate hn .. pr pehle inko
practically krn
Similarly ye kch tags hn
<sup> for creating superscript
<sub> for creating subscript
<strike> to sktrikethrough the text
<bdo> ye text ko ulta kr deta he.
<strong> ye bh bold jesa hi kam krta he
Ase hi kch aur bh tags hn
Setting The Title of our Webpage
Title <title></title> se create hta he jo header section mn lgta he
Changing the Font Color Size and Type
Inke ke lye <font > </font> use hta he,, pr inko hmn kch attributes dene prte hn , attributes starting tag mn hi dete hn hm
Jese ke color attribute color define krta he, face attribute font style set krta he, aur size attribute size set krta h
Changing the Background Color
Iske lye hm body tag mn bgcolor attribute lkhte hn aur color set krte hn
Similarly agr aap background mn koi image lgana chahte hn to. Hm bgcolor ki jagah simply background lkhn aur phr path lkhn
<body background=”C:/test/1.jpg”>
Agr apka picture usi folder mn pra he jahan html document aapne save kya he to phr ap smply file ka nam lkho
<body background=”1.jpg”>
Adding Image in html
iske lye <img> tag use hta he aur aur ye tag singular he to isko close krna lazmi nh he, aur is tag ko hmn kch attributes dene prte hn
specially src js mn hm source lkhte hn ke photo he kahan pe..
Similarly agr hm image ki height aur width set krna chahe hn to phr hm height aur width attributes use krte hn .
I hope aaja ka sb kch aapko sahee se smjh aagya hga,
Inshallah on next tutorial, hm lists ke bare mn prhng aur tables ke bh,, aur phr tym bcha to forms ke bare mn bh
Take Care of yu
See yu on next tutorial
Regards
Azhar Khaskheli
azharkhaskheli@gmail.com
