សំណុំបែបបទរចនាប័ទ្មជាមួយ CSS

រៀនកែលម្អរូបរាងគេហទំព័ររបស់អ្នក

ការរៀនពីរបៀបរចនាប័ទ្មជាមួយ CSS គឺជាមធ្យោបាយដ៏ល្អមួយដើម្បីកែលម្អរូបរាងនៃគេហទំព័ររបស់អ្នក។ សំណុំបែបបទ HTML គឺជាខ្មែរក្រហមក្នុងចំណោមរឿងដែលអន់បំផុតនៅលើទំព័របណ្ដាញភាគច្រើនបំផុត។ ពួកគេជាញឹកញាប់គួរឱ្យធុញទ្រាន់និង utilitarian និងមិនផ្តល់ច្រើននៅក្នុងវិធីនៃរចនាប័ទ្មនេះ។

ជាមួយ CSS ដែលអាចផ្លាស់ប្ដូរ។ ការរួមបញ្ចូល CSS ជាមួយទំរង់សំណុំបែបបទកម្រិតខ្ពស់អាចផ្តល់នូវទម្រង់ដ៏ស្រស់ស្អាតមួយចំនួន។

ប្តូរពណ៌

ដូចអត្ថបទដែរអ្នកអាចប្តូរពណ៌ផ្ទៃខាងមុខនិងផ្ទៃខាងក្រោយនៃធាតុសំណុំបែបបទ។

វិធីងាយស្រួលក្នុងការប្តូរពណ៌ផ្ទៃខាងក្រោយនៃទម្រង់បែបបទស្ទើរតែទាំងអស់គឺត្រូវប្រើលក្ខណសម្បត្តិពណ៌ផ្ទៃខាងក្រោយនៅលើស្លាកបញ្ចូល។ ឧទាហរណ៍កូដនេះអនុវត្តពណ៌ផ្ទៃខាងក្រោយពណ៌ខៀវ (# 9cf) នៅលើធាតុទាំងអស់។

បញ្ចូល {
background-color: # 9cf;
ពណ៌: # 000;
}

ដើម្បីផ្លាស់ប្តូរពណ៌ផ្ទៃខាងកិចនៃធាតុសំណុំបែបបទជាក់លាក់គ្រាន់តែបន្ថែម textarea និងជ្រើសរើសរចនាប័ទ្ម។ ឧទាហរណ៍:

បញ្ចូល, វាយអត្ថបទ, ជ្រើស {
background-color: # 9cf;
ពណ៌: # 000;
}

ត្រូវប្រាកដថាប្តូរពណ៌អត្ថបទបើអ្នកធ្វើឱ្យពណ៌ផ្ទៃខាងក្រោយងងឹត។ ពណ៌ដែលស្រដៀងគ្នា ជួយធ្វើឱ្យធាតុសំណុំបែបបទអាចអានបាន។ ឧទាហរណ៍អត្ថបទនៅលើពណ៌ផ្ទៃខាងក្រោយពណ៌ក្រហមដ៏ខ្មៅងងឹតអាចអានបានយ៉ាងងាយស្រួលប្រសិនបើពណ៌អត្ថបទមានពណ៌ស។ ឧទាហរណ៍កូដនេះដាក់អត្ថបទពណ៌សលើផ្ទៃខាងក្រោយពណ៌ក្រហម។

បញ្ចូល, វាយអត្ថបទ, ជ្រើស {
ពណ៌ផ្ទៃខាងក្រោយ: # c00;
ពណ៌: #fff;
}

អ្នកអាចដាក់ពណ៌ផ្ទៃខាងក្រោយលើស្លាកសំណុំបែបបទដោយខ្លួនឯង។ ចងចាំថាស្លាកសំណុំបែបបទគឺជា ធាតុប្លុក ដូច្នេះពណ៌បំពេញក្នុងចតុកោណកែងទាំងមូលមិនមែនគ្រាន់តែទីតាំងនៃធាតុនោះទេ។

អ្នកអាចបន្ថែមផ្ទៃខាងក្រោយពណ៌លឿងទៅធាតុប្លុកដើម្បីធ្វើឱ្យតំបន់លេចធ្លោដូចជា:

ទម្រង់ {
background-color: #ffc;
}

បន្ថែមស៊ុម

ដូចជាមួយនឹងពណ៌អ្នកអាចប្តូរស៊ុមនៃធាតុសំណុំបែបបទជាច្រើន។ អ្នកអាចបន្ថែមស៊ុមទោលមួយនៅជុំវិញសំណុំបែបបទទាំងមូល។ ត្រូវប្រាកដថាបន្ថែមចន្លោះ, ឬធាតុសំណុំបែបបទរបស់អ្នកនឹងត្រូវជាប់ជាប់នៅជាប់នឹងស៊ុម។

នេះជាឧទាហរណ៍នៃកូដសម្រាប់ស៊ុមខ្មៅ 1 ភីកសែលដែលមានទំហំ 5 ភិចសែល:

ទម្រង់ {
ព្រំដែន: 1px រឹង # 000;
ចន្លោះ: 5px;
}

អ្នកអាចដាក់ស៊ុមជុំវិញច្រើនជាងគ្រាន់តែសំណុំបែបបទខ្លួនវាផ្ទាល់។ ផ្លាស់ប្តូរស៊ុមរបស់ធាតុបញ្ចូលដើម្បីធ្វើឱ្យវាលេចធ្លោ:

បញ្ចូល {
ស៊ុម: 2px dashed # c00;
}

សូមប្រុងប្រយ័ត្ននៅពេលអ្នកដាក់ស៊ុមនៅលើប្រអប់បញ្ចូលនៅពេលដែលវាមើលទៅតិចជាងប្រអប់បញ្ចូលនៅពេលនោះហើយអ្នកខ្លះប្រហែលជាមិនដឹងថាពួកគេអាចបំពេញសំណុំបែបបទ។

ផ្សំលក្ខណៈពិសេសរចនាប័ទ្ម

ដោយការដាក់បញ្ចូលសំណុំបែបបទសំណុំបែបបទរបស់អ្នកជាមួយគំនិតនិង CSS មួយចំនួនអ្នកអាចបង្កើតសំណុំបែបបទដែលមើលទៅស្រស់ស្អាតដែលបំពេញបន្ថែមការរចនានិងប្លង់វែបសាយត៍របស់អ្នក។