សេចក្ដីលម្អិត
បានចេញផ្សាយនា
ព្រហស្បតិ៍, 10
វិច្ឆិកា 2011 07:20
និពន្ធដោយ
ជួន រតនា
ចុចដង៖
4988
HTML មកពីពាក្យ
Hypertext Markup Language ។ HTML គឺជាភាសាដំបូងសម្រាប់ សរសេរ
គេហទំព័រ។ក្នុង HTML គេប្រើ
Tag សម្រាប់ធ្វើការកំណត់នានា។
ឧទាហរណ៍
សេចក្ដីលម្អិត
HTML មានចែកជាពីរផ្នែកធំៗ
គឺ tag Header និង
tag Body ហើយ
tag ទាំងពីរនេះ
ត្រូវស្ថិតនៅក្នុង tag HTML។
ខាងក្រោមនេះ គឺជាទំរង់ទូទៅរបស់ HTML៖
ខាងក្រោមនេះ គឺជាទំរង់ទូទៅរបស់ HTML៖
1.<html>
2.<head><title>Name of
Page</title></head>
3.<body>
4.// any text here
5.</body>
6.</html>
សំគាល់:
<html> គឺជា
tag ដែលយើងប្រើដើម្បីបើកនៅពេលដែលចាប់ផ្តើមដំបូងនិងនៅពេលបញ្ចប់នៃ
Page របស់យើង។
<body> គឺជា tag សម្រាប់ឲ្យយើងសរសេរកូដផ្សេងដើម្បីបង្ហាញនៅលើPage របស់យើង ។
<body> គឺជា tag សម្រាប់ឲ្យយើងសរសេរកូដផ្សេងដើម្បីបង្ហាញនៅលើPage របស់យើង ។
ឧទាហរណ៍
1.<html>
2.<head><title>Name of
Page</title></head>
3.<body>
4.This is my first time with HTML.
5.</body>
6.</html>
៣. កម្មវិធីសម្រាប់សរសេរ HTML
សេចក្ដីលម្អិត
យើងមានកម្មវិធីជាច្រើនដែលប្រើសម្រាប់សរសេរ
HTML មានដូចជា Dreamweaver,
Notepad ,Notepad++ ឬ WordPad ជាដើម។ទាញយក
កម្មវិធី Adobe Dreamweaver CS5
សេចក្ដីលម្អិត
ដើម្បីបង្កើតនូវ Page HTML យើងអាចបង្កើតតាមកម្មវិធីជាច្រើនដូចជា
Dreamweaver, Notepad , Notepad++ ឬ WordPad ជាដើម
តែពេលនេះ អាយធីកូនខ្មែរ
សូមលើកយកកម្មវិធី Notepad
មកបង្ហាញ។ Notepad គឺជាកម្មវិធីតូចមួយរបស់វីនដូផ្ទាល់
ហើយជាទូទៅសម្រាប់ អ្នកដែលរៀន HTML
គួរតែប្រើវា។
១. បើកកម្មវិធី Notepad : Start -> Run -> Notepad
( ឬចុច Mouse ស្តាំយក New -> Text Document ) ។
២. ធ្វើការសរសេរ Code របស់ HTML
៣. រក្សាទុកវាជា File HTML ដែលមាន Extension .html
( ឬចុច Mouse ស្តាំយក New -> Text Document ) ។
២. ធ្វើការសរសេរ Code របស់ HTML
៣. រក្សាទុកវាជា File HTML ដែលមាន Extension .html
សេចក្ដីលម្អិត
HTML គឺជា
Markup Language ដូចនេះវាកើតឡើងពីបណ្តុំនៃ tag ហើយ Tag របស់វាមានពីរគឺ Open tag និង Close tag។
ឧទាហរណ៍
1.This is my frist paragraph.
2.<h1>This is heading 1</h1>
ប៉ុន្តែទន្ទឹមនឹងនោះ វាក៏មាន tag មួយចំនួនដែលមិនមាន
Open tag ដូចឧទាហរណ៍ខាងក្រោម:
1.<img src="path/image_name.extension" ... />
2.// new line
3.// insert a line
សំគាល់:
- <p> . . . </p> :គឺជា tag សម្រាប់កំណត់អត្ថបទរបស់យើងជាកថាខណ្ខ។
- <br/> :គឺជា Tag ប្រើសម្រាប់ចុះបន្ទាត់។
- <hr/> :គឺជា Tag ប្រើសម្រាប់ទាញយកនូវបន្ទាត់មកបង្ហាញនៅលើ Page របស់យើង។
- <br/> :គឺជា Tag ប្រើសម្រាប់ចុះបន្ទាត់។
- <hr/> :គឺជា Tag ប្រើសម្រាប់ទាញយកនូវបន្ទាត់មកបង្ហាញនៅលើ Page របស់យើង។
សេចក្ដីលម្អិត
Tag របស់
HTML ភាគច្រើនតែងតែមាន
Attribute ដើម្បីកំណត់លក្ខណៈបន្ថែមទៅលើ
tags ទាំង
នោះ។
ឧទាហរណ៍
01.<html>
02.<head><title>Paragraph</title></head>
03.<body>
04.
05.Welcome to itkonkhmer.Thanks for visiting and support us.
06.This is example how to use tag and attribute.
07.
08.</body>
09.</html>
សំគាល់:
Align :ជា
Attribute ប្រើសម្រាប់កំណត់ទំរង់របស់អត្ថបទរបស់យើង
ដែលវាមានដូចជា Justify , Center,Leftនិង Right។
៧. Headings
សេចក្ដីលម្អិត
Heading គេប្រើសម្រាប់កំណត់ម៉ូតអក្សរដែលមាន៦ប្រភេទ
គឺពី <h1> ដល់
<h6> (ពីធំទៅតូច) ហើយ
ជាទូទៅគេប្រើសម្រាប់កំណត់ទៅលើចំនងជើង នៃអត្ថបទរបស់យើង។1.<h1>
heading h1 </h1>
2..
3..
4..
5..
6.</h6>
heading h6 </h6>
01.<html>
02.<head><title>Welcome
to itkonkhmer</title></head>
03.<body>
04.<h1>
this is heading h1 </h1>
05.<h2>
this is heading h2 </h2>
06.<h3>
this is heading h3 </h3>
07.<h4>
this is heading h4 </h4>
08.<h5>
this is heading h5 </h5>
09.<h6>
this is heading h6 </h6>
10.</body>
11.</html>
this is heading h1
this is heading h2
this is heading h3
this is heading h4
this is heading h5
this is heading h6
សេចក្ដីលម្អិត
- <b> ….</b> : សម្រាប់កំណត់អក្សរដិត
- <i>…..</i> : សម្រាប់កំណត់អក្សរទ្រេត
- <u>….</u> : សម្រាប់ដាក់បន្ទាត់ពីក្រោម
- <small>…</small> : សម្រាប់កំណត់អក្សរឲ្យមានទំហំតូច
- <big>….</big> : សម្រាប់កំណត់អក្សរឲ្យមានទំហំធំ
- <sup>…</sup> : សម្រាប់សរសេរជាស្វ័យគុណ
- <sub>….</sub> : សម្រាប់សរសេរជាសន្ទស្សន៍
- <i>…..</i> : សម្រាប់កំណត់អក្សរទ្រេត
- <u>….</u> : សម្រាប់ដាក់បន្ទាត់ពីក្រោម
- <small>…</small> : សម្រាប់កំណត់អក្សរឲ្យមានទំហំតូច
- <big>….</big> : សម្រាប់កំណត់អក្សរឲ្យមានទំហំធំ
- <sup>…</sup> : សម្រាប់សរសេរជាស្វ័យគុណ
- <sub>….</sub> : សម្រាប់សរសេរជាសន្ទស្សន៍
ឧទាហរណ៍
01.<html>
02.<head><title>Text
Style</title></head>
03.<body>
04.<b> Bold </b>
05.
06.<i> Italic </i>
07.
08.<u> Underline </u>
09.
10.<small> Small </small>
11.
12.<big> Big </big>
13.
14.A <sup><small> 2 </small><sup> -B
<sup><small> 2 </small></sup>
15.=(A-B)(A+B)
16.
17.H <sub><small> 2 </small></sup> 0
18.</body>
19.</html>
លទ្ធផល
Bold
Italic
Underline
Small
Big
A2-B2=(A-B)(A+B)
H2O
Italic
Underline
Small
Big
A2-B2=(A-B)(A+B)
H2O
សំគាល់ៈ
tag <br/> គឺជា tag ប្រើសម្រាប់ចុះបន្ទាត់។វាជា tag ដែលមានតែបើកមិនមានបិទទេ។ គេអាច សរសេរ វាបានពីររបៀបគឺ <br> ឬ <br/>។
tag <br/> គឺជា tag ប្រើសម្រាប់ចុះបន្ទាត់។វាជា tag ដែលមានតែបើកមិនមានបិទទេ។ គេអាច សរសេរ វាបានពីររបៀបគឺ <br> ឬ <br/>។
សេចក្ដីលម្អិត
ដើម្បីកំណត់ពុម្ពអក្សរយើងប្រើ tag <font> ហើយនៅក្នុង tag <font> មាន attribute មួយចំនួន ដូចខាងក្រោម
:
- Face: សំរាប់ដាក់ឈ្មោះពុម្ពអក្សរ
- Size: សំរាប់កំណត់ទំហំរបស់អក្សរ
- Color: សម្រាប់កំនត់ពណ៌របស់អក្សរ
- Size: សំរាប់កំណត់ទំហំរបស់អក្សរ
- Color: សម្រាប់កំនត់ពណ៌របស់អក្សរ
ឧទាហរណ៍
លទ្ធផល
This is the first time for me to learning HTML. This is example
how to use tag font.
សេចក្ដីលម្អិត
Link គឺជាការដាក់តំណភ្ជាប់ទៅកាន់ទំព័រណាផ្សេងទៀត
ហើយយើងអាចដាក់ Link ទៅលើ
អក្សរ ឬ លើរូបភាពក៏បាន។
ឧទាហរណ៍
សំគាល់
target="_blank" : ប្រើសម្រាប់ចូលទៅកាន់ Page ដែលយើង Link ទៅ នៅ tab ថ្មីនៃ Browser របស់យើង។
target="_blank" : ប្រើសម្រាប់ចូលទៅកាន់ Page ដែលយើង Link ទៅ នៅ tab ថ្មីនៃ Browser របស់យើង។
សេចក្ដីលម្អិត
ដើម្បីយករូបភាពមកបង្ហាញនៅលើទំព័ររបស់យើង
យើងប្រើ tag មួយដែលមានឈ្មោះថា <img> ខាងក្រោមនេះគឺជាទំរង់របស់
tag <img>
ឧទាហរណ៍
សំគាល់ :
- Border :សម្រាប់កំណត់កំរាស់របស់រូបភាព
- Title: ជា Attribute ប្រើសម្រាប់ដាក់ title ទៅឲ្យរូបភាព ហើយពេលដែលយើងដាល់ Mouse លើ រូបភាព ពេលនោះវានឹងចេញ title ដែលយើងបានដាក់។
- Width: ជា Attribute ប្រើសម្រាប់កំណត់ ប្រវែងទទឹងរបស់រូបភាព
- Height: ជា Attribute ប្រើសម្រាប់កំណត់កំពស់របស់រូបភាព
- Title: ជា Attribute ប្រើសម្រាប់ដាក់ title ទៅឲ្យរូបភាព ហើយពេលដែលយើងដាល់ Mouse លើ រូបភាព ពេលនោះវានឹងចេញ title ដែលយើងបានដាក់។
- Width: ជា Attribute ប្រើសម្រាប់កំណត់ ប្រវែងទទឹងរបស់រូបភាព
- Height: ជា Attribute ប្រើសម្រាប់កំណត់កំពស់របស់រូបភាព
សេចក្ដីលម្អិត
ដើម្បីបង្កើត Table យើងមានទំរង់ដូចខាងក្រោម:
ឧទាហរណ៍ទី១
សំគាល់:
<th> : ប្រើចំពោះ
Column ដែលជា
Column Header
ឧទាហរណ៍ទី២
សំគាល់:
Rowspan : ជា
Attribute ប្រើសម្រាប់
Merge Row នៃ
Table។
Colspan :ជា Attribute ប្រើសម្រាប់ Merge Column នៃ Table។
Colspan :ជា Attribute ប្រើសម្រាប់ Merge Column នៃ Table។
សេចក្ដីលម្អិត
Preformatted គឺជាវិធីសម្រាប់បង្ហាញទំរង់ដើមនូវអ្វីដែលយើងបានសរសេរនៅក្នុង
code html ។
លទ្ធផល
****** **********
****** **********
**
**
**
**
**
**
**
**
**
**
****** **
****** ** konkhmer.com
១៤. របៀបបង្កើត Number List
សេចក្ដីលម្អិត
ទំរង់ទូទៅឧទាហរណ៍ទី១
លទ្ធផល
Web Development
- HTML
- Java Script
- CSS
- PHP & MySQL
សំគាល់:
Type :សំរាប់កំនត់ប្រភេទ List របស់យើងដែលមាន៖ 1 , a , A , I , i ។
Start :សំរាប់កំនត់តំលៃចាប់ផ្តើម (ដាក់តំលៃលេខជានិច្ច ) ។
លទ្ធផល
Web Development
- HTML
- Java Script
- CSS
- PHP & MySQL
Programming
- C program
- C++
- Java
- VB.NET
១៥. របៀបបង្កើតList ជានិមិត្តសញ្ញា
សេចក្ដីលម្អិត
ទំរង់ទូទៅឧទាហរណ៍
សំគាល់
Type :សំរាប់កំនត់ប្រភេទ List ដែលមាន៖ square , circle , disc ។
លទ្ធផល
Symbol List
- C program
- C++
- Java
- VB.NET
សេចក្ដីលម្អិត
នៅក្នុងភាសា HTML គេប្រើប្រាស់ Form ដើម្បីធ្វើការបញ្ចូលទិន្នន័យដើម្បីបញ្ជូនទៅកាន់
Server។
ទំរង់ទូទៅនៃការបង្កើត Form
ទំរង់ទូទៅនៃការបង្កើត Form
ដើម្បីឲ្យយើងអាចបញ្ចូលទិន្នន័យបាន
គឺយើងត្រូវពឹងអាស្រ័យទៅលើធាតុរបស់ Form
ដែលមាន នៅចំនុចបន្ទាប់។
សេចក្ដីលម្អិត
Text Field គឺជាធាតុមួយរបស់
Form ដែលគេប្រើសម្រាប់បញ្ចូលទិន្នន័យជា
Text ។
ទំរង់ទូទៅ
ទំរង់ទូទៅ
ឧទាហរណ៍
សំគាល់
Name: គឺជា Attribute ប្រើសម្រាប់បញ្ជាក់ឈ្មោះទៅឲ្យ Text Field របស់យើង។
Name: គឺជា Attribute ប្រើសម្រាប់បញ្ជាក់ឈ្មោះទៅឲ្យ Text Field របស់យើង។
លទ្ធផល
Input information
Enter First Name
|
:
|
|
Enter Last Name
|
:
|
|
សេចក្ដីលម្អិត
Password Field គឺជាធាតុមួយរបស់ Form
ដែលប្រើសម្រាប់បញ្ចូលលេខសំងាត់ ។
ទំរង់ទូទៅ
ទំរង់ទូទៅ
ឧទាហរណ៍
លទ្ធផល
Login Form
Username
|
:
|
|
Password
|
:
|
|
សេចក្ដីលម្អិត
Radio Buttons គឺជាធាតុមួយរបស់
Form ដែលគេប្រើសម្រាប់បញ្ចូលទិន្នន័យ ដោយធ្វើការ
ជ្រើស រើសជំរើសដែលយើងបានដាក់ ហើយយើងអាចជ្រើសរើសបានតែមួយគត់។
ទំរង់ទូទៅ
ទំរង់ទូទៅ
ឧទាហរណ៍
សំគាល់
Value: គឺជា Attribute ប្រើសម្រាប់រក្សាទុកតំលៃរបស់ Radio Button និមួយៗ។
ចំណាំ: Radio Button ដែលយើងប្រើសម្រាប់ឲ្យគេជ្រើសរើសនូវជំរើសអ្វីមួយ ត្រូវមានឈ្មោះដូច គ្នា។
Value: គឺជា Attribute ប្រើសម្រាប់រក្សាទុកតំលៃរបស់ Radio Button និមួយៗ។
ចំណាំ: Radio Button ដែលយើងប្រើសម្រាប់ឲ្យគេជ្រើសរើសនូវជំរើសអ្វីមួយ ត្រូវមានឈ្មោះដូច គ្នា។
លទ្ធផល
Radio Buttons
Sex
|
:
|
Male
Female
|
Subject
|
:
|
Web
Design Programming Network
|
សេចក្ដីលម្អិត
Check Box គឺជាធាតុមួយរបស់
Form វាមានលក្ខណៈស្រដៀងនឹង
Radio Button ដែរគឺបញ្ចូល
ទិន្នន័យតាមការជ្រើសរើស តែវាខុសត្រង់ Check
Box គេប្រើចំពោះការបញ្ចូលទិន្នន័យដែលអាច
មានជំរើសច្រើន។
ទំរង់ទូទៅ
ទំរង់ទូទៅ
ឧទាហរណ៍
លទ្ធផល
Favorite Programming
C
Prgramming
C++
Java
VB.NET
C#
C++
Java
VB.NET
C#
សេចក្ដីលម្អិត
Drop down list គឺជាធាតុមួយរបស់ Form
ដែលគេប្រើសម្រាប់ឲ្យយើងជ្រើសរើសជំរើសណាមួយ ។
ទំរង់ទូទៅ
ទំរង់ទូទៅ
ឧទាហរណ៍
លទ្ធផល
Login Choose Language
សេចក្ដីលម្អិត
Submit Button គឺជាធាតុមួយរបស់
Form ដែលគេប្រើវាសម្រាប់បញ្ចូលទិន្នន័យដែលយើងបាន
បញ្ចូលនៅក្នុង Text Box, Checkbox និងផ្សេងៗទៀតទៅកាន់ Server។
ទំរង់ទូទៅ
ទំរង់ទូទៅ
សំគាល់:
Method: ជា Attribute ប្រើសម្រាប់កំណត់ពីវិធីនៃការបញ្ចូលទិន្នន័យ។ ពេលណាដែលយើងប្រើ method get នោះទិន្នន័យដែលយើងបញ្ចូនវាមិនបង្ហាញនៅលើ Address bar ទេ ចំនែកឯ method post វាបង្ហាញនៅលើ Address bar។
Action: ជា Attribute ប្រើសម្រាប់កំណត់ Page ដែលយើងចង់បញ្ចូលទិន្នន័យទៅកាន់។
Method: ជា Attribute ប្រើសម្រាប់កំណត់ពីវិធីនៃការបញ្ចូលទិន្នន័យ។ ពេលណាដែលយើងប្រើ method get នោះទិន្នន័យដែលយើងបញ្ចូនវាមិនបង្ហាញនៅលើ Address bar ទេ ចំនែកឯ method post វាបង្ហាញនៅលើ Address bar។
Action: ជា Attribute ប្រើសម្រាប់កំណត់ Page ដែលយើងចង់បញ្ចូលទិន្នន័យទៅកាន់។
ឧទាហរណ៍
លទ្ធផល
Login
Login
Username :
Password :
Password :