CSS Basic
លក្ខណៈទូទៅនៃ CSS
Comments
ជា statements ដែលប្រើសំរាប់ពិពណ៌នាបន្ថែមទៅកាន់កូដ
ដែលយើងបានសរសេរ សំរាប់ជាការរំលឹកថ្ងៃ
ក្រោយផង
និងងាយស្រួលក្នុងការស្វែងរកទីតាំងនៃកូដផង។ Comments មិនត្រូវបានបកប្រែដោយ Interpreter ទេ។
Syntax
/* This is my first
css_statement
That wrote to create stylesheets For
my web page*/
វិធីក្នុងការកំណត់ Style
កំនត់តាមឈ្មោះរបស់ tag
ជាការកំនត់ដោយយកឈ្មោះរបស់ tag។ ការធ្វើបែបនេះគ្រប់ element
ដែលប្រើ tag ដែលបានកំណត់នោះ
វានឹងទទួលតំលៃដូចៗគ្នា។
ដើម្បីកំណត់តាមឈ្មោះយើងគ្រាន់តែដាក់ឈ្មោះរបស់ tag ហើយបន្តដោយ {}
Syntax:
Tag_Name{
Css_statement
}
ឧទាហរណ៍ ៖
យើងនឹងកំណត់ពណ៌គ្រប់ element ដែលប្រើ <h1> tagអោយទៅជាពណ៌ក្រហម នឹងតម្រឹមវាមកនៅ
ចំកណ្តាល។
<style type=”text/css”>
H1{
color:red;
text-align:center;
}
</style>
.
.
.
<H1>Welcome</H1>
<H2>Heading 2</H2>
<H1>To My Site</H1>
កំណត់តាម Class
ជាការកំណត់ដោយបង្កើត class (ក្រុម) នៃ style មួយ។
ដើម្បីអោយ element ទទួល style ដែលកំណត់ដោយ
class មួយ ក្នុង open tag នៃ element ត្រូវប្រើ
attribute មួយឈ្មោះថា class និងកំណត់ value របស់វាទៅតាម
class ដែលយើងត្រូវការ។
ដើម្បីបង្កើត class យើងប្រើ
សញ្ញា (.) បន្តដោយឈ្មោះ class និង {}
Syntax:
.class_Name{
Css_statement
}
ឧទាហរណ៍ ៖ យើងមាន class ចំនួនពីរ
ទី១ យើងប្រើ Font Khmer OS ទំហំ 20px ទី២ យើងប្រើ Font Time
New Roman ទំហំ
14px។
<head>
<meta
http-equiv="Content-Type" content="text/html; charset=UTF8" />
<style
type=”text/css”>
.khmer{
font-family:Khmer OS;
font-size:20px;
}
.english{
font-family:Time New Roman;
font-size:14px;
}
</style>
</head>
<body>
<h1 class=”khmer”>សួស្តី</h1>
<span
class=”khmer”>សូមស្វាគមន៍មកកាន់</span>
<span
class=”english”> Web Page</span>
<span
class=”khmer”>របស់យើងខ្ញុំ</span>
</body>
ចំណាំដើម្បីអោយ Browser អាចបង្ហាញអក្សរដែលប្រើ Unicode បានត្រូវកំណត់ នូវ attribute content របស់ meta tag នូវតំលៃថា <meta
http-equiv="Content-Type" content="text/html; charset=UTF8" />
ការកំណត់តាម id
ជាការកំណត់អោយ element ណាមួយតែម្តង
ដោយយក id របស់ element នោះមកប្រើតែម្តង។
គេប្រើសញ្ញា # បន្តដោយ
id និង {}
Syntax
#element_id{
Css_statements
}
ឧទាហរណ៍ ៖ យើងនឹងបង្កើតនូវផ្ទាំងអត្ថបទមួយសំរាប់ដាក់អក្សរខ្មែរ
មានផ្ទៃខាងក្រោយពណ៌ប្រផេះទំហំ
១៤។
<head>
<meta http-equiv="Content-Type"
content="charset=UTF-8"/>
<style type="text/css">
#khmer_content{
Background:#CCCCCC;
Font-family:Khmer OS System;
Font-size:14px;
}
</style>
</head>
<body>
<div
id="khmer_content">
Comments ជា statements ដែលប្រើសំរាប់ពិពណ៌នាបន្ថែមទៅកាន់ កូដដែលយើងបានសរសេរ សំរាប់
ជាការរំលឹកសំរាប់ថ្ងៃក្រោយផង
និងងាយស្រួលក្នុងការស្វែងរកនូវកូដផង។ Comments មិនត្រូវបានបកប្រែដោយ
Interpreter ទេ។
</div>
</body>
ចំណាំ៖ យើងអាចកំណត់បានច្រើន tag, class, id ក្នុងពេលតែមួយបាន ការប្រើ(,)។
ឧ. H1,H2{…}
.khmerTop,.khmerBottom{…}
#box1,#box2{…}
CSS Basic
Reviewed by Unknown
on
11:19 PM
Rating:
Reviewed by Unknown
on
11:19 PM
Rating:
No comments: