Welcome to ZyberPH. Be one of us! Read first our VIP RULES. For more info and guide you. Read our FAQ

Html Tutorial For Newbie

Discussions related to C++, HTML, PHP, ASP, ColdFusion, JavaScript, Perl, Python, Ruby, WML, SQL, XML, and other programming languages.
Post Reply
User avatar
Arigatou01
VIP User
VIP User
Posts: 226
Joined: Thu Mar 24, 2016 1:57 pm
Location: Sa Loob Ng REF
Contact:

Html Tutorial For Newbie

Post by Arigatou01 »

Requirements:
Notepad o Notepad++
Keyboard (literal kailangan talaga ng keyboard)
browser kahit ano klase
lastly kailanga ng utak para maintindihan.
-------------------------------------------------------------
Ang ituturo ko sainyo yung basic HTML,kasi pag professional HTML baka hindi nyo maintindihan.
pero pag marunong naman talaga kayo pwede ka gumawa ng pro HTML..

Eto na step by step.

1Open mo yung notepad
2: Tapos type mo sa tuktok ay <!DOCTYPE>
3:at tapos nun gagawa ka nanang Body ng HTML mo pero basic lang ok
gayahin nyo ito
|<!DOCTYPE> |
|<title>kahit anong title yan</title> |
|<html> |
|<body> |
|<h1>header1</h1> |
|<p>paragraph</p> |
|</body> |
|</html> |
|---------------------------------------------------------------------------------------------------------

Yan ang napaka basic na HTML .
at pag katapos mong i copy i save mo sya gamit ng "save as",at pag may lumabas na window at lagyan mo ng title yung HTML mo na
index.html pwede ring "htm",at pag save mo HTML na sya at open mo yung sinave mo na Html at makikita mo yung gawa mo napaka
plain at white lang at text ang makikita mo sa HTML mo.
At kung gusto mo ng medyo magandang "html" ay pwede rin..

sundin nyo lang ang babasahin nyo.
---------------------------------------------------------------------------------------------
Ang Html na ito ay mag kakaroon kulay at font.
tuturuan ko rin kayo mag resize mga font ninyo.

Eto step by step.

1:ganun lang din sa unang method ang gagayahin nyo.
2:copy nyo nalang yung gagawin ko.
<!DOCTYPE>
<title>kahit anong title yan</title>
<html>
<body style="background-color:grey;" >
<h1 style"color:green;font-family:verdana;">header1</h1>
<p style"color:green;font-family:verdana;">paragraph</p>
<p style"color:green;font-family:verdana;font-size:50px;">paragraph</p>
</body>
</html>
3:ganun lang din sa pag save ninyo ng HTML sa method 1


At yan ang pano gumawa na may kasamang kulay at font color/resize/style.

Pero wag kayo mag alala tuturuan ko din kayo kung ano ang meaning ng mga text na yan at kung pano gamitin ng maayos..

pero tuturuan ko naman kayo pano mag lagay ng image sa HTML nyo.
---------------------------------------------------------------------------------------------------------
tuturuan ko kayo ng step by step.

1: Copy niyo nalang ito para mabilis,at sasabihin ko rin naman ang meaning nyan mamaya.

<img src="file:/D:/examplelangto.png" style="width:1335px;height:138px;">

2: wag nyo gagayahin yung "file:/D:/examplelangto.png" kasi i nembento ko lang yan ok.
3: para makita nyo yung image mo sa HTML hanapin mo yung picture mo
ex.na sa desktop yung picture mo,tapos right click mo yung image mo tapos click mo yung open google chrome/opera/mozzila/explorer
o kung ano paman yan.
4: at pag may lumabas na window ng browser makikita mo yung image mo dun pero hin pa yun ang HTML i cocopy mo lang yung URL ng image mo
5: tapos i lagay mo sa "<img src="i paste mo rito yung url ng image mo.png" style"width:354px;height:138px;">
para makita mo yung width at heigth ng image mo,i right click mo yung image mo at click mo yung properties at click mo yung details.
makikita mo na yung totoong widht at height nya.

At yan pano mag lagay ng image file sa HTML.
madali kung may alam,kung walang alam,walang "UTAK"
-----------------------------------------------------------------------------------------------------
At eto na ang huli kong ituturo.
kung ano ang mga meaning ng mga yan at kung pano gamitin yang mga text na yan.

<!DOCTYPE>= dinidifine nya yung document type.
<body>= eto yung magigiging mukha ng html mo
<b>= eto ang bold text
<br>= eto yung breakline,mag lileave eto ng isang line ng html mo
<h1> hanggang <h6>= eto ang header 1 hanggang header 6,eto yung parang magigiging title ng sa html mo
<html>= eto yung kabuuang html mo
height= eto ang magiging taas o tangkad ng text
<p>= eto ang paragraph dito mo ilalagay ang mahahabang text.
src= dito mo ilalagay ang source ng file
style= dito mo i lalagay ang style ng text o magiging kulay.
<title>= yan ang magiging title ng html
widht= eto ang magiging lapad ng text

Yan na Muna.
sen360
Posts: 3
Joined: Sat Apr 16, 2016 9:38 pm

Re: Html Tutorial For Newbie

Post by sen360 »

Thanks sir
User avatar
vincent1255
Veteran
Veteran
Posts: 157
Joined: Mon Apr 18, 2016 10:28 pm
Location: Cebu,1508

Re: Html Tutorial For Newbie

Post by vincent1255 »

THNX
User avatar
lanzie22
Veteran
Veteran
Posts: 115
Joined: Thu Mar 24, 2016 9:33 pm
Location: lanao del norte

Re: Html Tutorial For Newbie

Post by lanzie22 »

thank you sir.keep sharing
Image
hokagemoves123
Beginner
Beginner
Posts: 7
Joined: Thu Apr 21, 2016 8:26 am

Re: Html Tutorial For Newbie

Post by hokagemoves123 »

Thank you for sharing sir :D
User avatar
Kawaii
Senior
Senior
Posts: 290
Joined: Thu Apr 07, 2016 7:29 pm
Location: Valenzuela city
Contact:

Re: Html Tutorial For Newbie

Post by Kawaii »

UP! :3
Image :guns PAST IS PAST DISQUALIFIED IS DISQUALIFIED :guns
Post Reply

Return to “Programming & Web Design”