ចែករំលែកលទ្ធផលការងារសម្រាប់ថ្ងៃនេះ

តើត្រូវបញ្ចូល CSS ទៅកាន់ HTML បានដូចម្តេច?

មានវិធីបីយ៉ាងដើម្បីបញ្ចូល ការរចនាបន្ថែម (Style) ចូលទៅក្នុង HTML ៖

  • External style sheet
  • Internal style sheet
  • Inline style

តើអ្វីជា External Style Sheet?

External style sheet  គឺជាការផ្តាច់ Style Sheet ទៅក្នុង File CSS មួយផ្សេងដាច់ដោយឡែក។ វាផ្តល់ភាពងាយស្រួល ដែល HTML Files ជាច្រើនអាចប្រើប្រាស់ CSS file តែមួយ។ ការប្រើប្រាស់ External Style Sheet ផ្តល់អត្ថប្រយោជន៍ជាច្រើន ដូចជាជួយ កាត់បន្ថយកូដក្នុង HTML file  ងាយស្រួលក្នុងការកែ Style Sheet តែមួយកន្លែង ។

រាល់ HTML files ទាំងអស់ ភ្ជាប់ទៅកាន់ CSS file ដោយប្រើ  <link> tag. <link> tag ត្រូវតែដាក់នៅក្នុង <head></head> ។

<head>
<link rel=”stylesheet” type=”text/css” href=”mystyle.css”>
</head>

External style sheet អាចសរសេរឡើងដោយប្រើ Text Editor ផ្សេងៗ។ CSS file មិនត្រូវមាន HTML tag ទេ គឺមានតែរូបមន្ត CSS ប៉ុណ្ណោះ។

hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url(“images/back40.gif”);}

Remark មិនត្រូវមាន ចន្លោះ(space) នៅចន្លោះរវាង តម្លៃរបស់ Propery និង ខ្នាតរបស់វាទេ ។ (ឧទា. margin-left:20 px). វិធីសរសេរត្រូវគឺ : margin-left:20px;


តើអ្វីជា Internal Style Sheet?

Internal style sheet ត្រូវបានគេប្រើនៅពេលដែល HTML file មួយ ប្រើការរចនាមួយតែឯង។  ដើម្បីសរសេរ Internal Style Sheet គឺត្រូវប្រកាសវានៅចន្លោះ <head></head>ដោយប្រើ <style> tag ។

<head>
<style>
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url(“images/back40.gif”);}
</style>
</head>

តើអ្វីជា Inline Styles?

Inline style sheet គឺជាការសរសេរ Style Sheet នៅក្នុង HTML tag ។ Style Sheet ដែលសរសេរជា Inline គឺអាចកំណត់ការរចនាបានតែ ប្លុក tag នោះតែប៉ុណ្ណោះ វាមិនការប្រែប្រួលទៅដល់ tag ផ្សេងៗទៀតដែលមានឈ្មោះដូចគ្នានោះទេ។ ដោយការប្រើប្រាស់ style attribute ។

សូមមើលឧទាហរណ៍ខាងក្រោម៖

<p style=”color:sienna;margin-left:20px”>This is a paragraph.</p>