វិធីផ្លាស់ប្តូរពណ៌ពុម្ពអក្សរគេហទំព័រជាមួយ CSS

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

ពណ៌ពុម្ពអក្សរអាចត្រូវបានផ្លាស់ប្តូរដោយប្រើ សន្លឹករចនាប័ទ្មខាងក្រៅសន្លឹករចនាប័ទ្ម ខាងក្នុង ឬវាអាចត្រូវបានផ្លាស់ប្តូរដោយប្រើ រចនាប័ទ្មបន្ទាត់ នៅក្នុងឯកសារ HTML ។ ការអនុវត្តល្អបំផុតកំណត់ថាអ្នកគួរតែប្រើសន្លឹករចនាប័ទ្មខាងក្រៅសម្រាប់រចនាប័ទ្ម CSS របស់អ្នក។ សន្លឹករចនាប័ទ្មខាងក្នុងដែលជារចនាប័ទ្មសរសេរដោយផ្ទាល់នៅក្នុង "ក្បាល" នៃឯកសាររបស់អ្នកត្រូវបានប្រើជាទូទៅសម្រាប់ទំព័រតូចទំព័រមួយ។ រចនាប័ទ្មក្នុងបន្ទាត់គួរតែត្រូវបានជៀសវាងព្រោះពួកវាមានលក្ខណៈស្រដៀងទៅនឹងស្លាក "ពុម្ពអក្សរ" ចាស់ដែលយើងបានដោះស្រាយជាច្រើនឆ្នាំកន្លងមកហើយ។ រចនាប័ទ្មក្នុងបន្ទាត់ទាំងនោះធ្វើឱ្យពិបាកក្នុងការគ្រប់គ្រងរចនាប័ទ្មពុម្ពអក្សរព្រោះអ្នកនឹងត្រូវផ្លាស់ប្តូរពួកវានៅគ្រប់ទម្រង់នៃរចនាប័ទ្មក្នុងតួ។

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

បន្ថែមរចនាប័ទ្មដើម្បីប្តូរពណ៌ពុម្ពអក្សរ

សម្រាប់ឧទាហរណ៍នេះអ្នកត្រូវមានឯកសារ HTML សម្រាប់ការសម្គាល់ទំព័ររបស់អ្នកនិងឯកសារ CSS ដាច់ដោយឡែកមួយដែលត្រូវបានភ្ជាប់ទៅឯកសារនោះ។ ឯកសារ HTML ទំនងជាធ្វើឱ្យធាតុមួយចំនួននៅក្នុងវា។ មួយដែលយើងមានការព្រួយបារម្ភសម្រាប់គោលបំណងនៃអត្ថបទនេះគឺជាធាតុកថាខណ្ឌ។

នេះជាវិធីដើម្បីផ្លាស់ប្តូរពណ៌ពុម្ពអក្សរនៃអត្ថបទនៅក្នុងស្លាកកថាខណ្ឌដោយប្រើសន្លឹករចនាប័ទ្មខាងក្រៅរបស់អ្នក។

តម្លៃពណ៌អាចត្រូវបានបញ្ជាក់ជាពាក្យគន្លឹះពណ៌លេខពណ៌ RGB ឬលេខពណ៌ប្រព័ន្ធគោលដប់ប្រាំមួយ។

  1. បន្ថែមគុណលក្ខណៈរចនាប័ទ្មសម្រាប់ស្លាកកថាខណ្ឌ:
    1. p {}
  2. ដាក់លក្ខណសម្បត្តិ ពណ៌ នៅក្នុងរចនាប័ទ្ម។ ដាក់សញ្ញា (:) បន្ទាប់ពីលក្ខណៈសម្បត្តិនោះ:
    1. p {color:}
  3. បន្ទាប់មកបន្ថែមតម្លៃពណ៌របស់អ្នកបន្ទាប់ពីលក្ខណសម្បត្តិ។ សូមប្រាកដថាបញ្ចប់តម្លៃនោះដោយសញ្ញាតង់ក្រចក:
    1. p {color: black;}

កថាខណ្ឌនៅក្នុងទំព័ររបស់អ្នកឥឡូវនេះនឹងមានពណ៌ខ្មៅ។

ឧទាហរណ៍នេះប្រើពាក្យគន្លឹះពណ៌ - "ខ្មៅ" ។ នោះគឺជាវិធីមួយដើម្បីបន្ថែមពណ៌នៅក្នុង CSS ប៉ុន្តែវាមានកំរិតខ្លាំងណាស់។ ការប្រើពាក្យគន្លឹះសម្រាប់ "ខ្មៅ" និង "ស" គឺត្រង់ចាប់តាំងពីពណ៌ពីរនោះមានលក្ខណៈជាក់លាក់ប៉ុន្តែតើមានអ្វីកើតឡើងបើអ្នកប្រើពាក្យគន្លឹះដូចជា "ក្រហម" "ខៀវ" ឬ "បៃតង"? តើអ្នកនឹងទទួលបានម្លប់ពណ៌ក្រហមខៀវឬបៃតងឬទេ? អ្នកមិនអាចបញ្ជាក់ច្បាស់ថាពណ៌ណាដែលអ្នកចង់បានជាមួយពាក្យគន្លឹះនោះទេ។ នេះហើយជាមូលហេតុដែលតម្លៃគោលដប់ប្រាំមួយជាទូទៅត្រូវបានប្រើក្នុងកន្លែងនៃពាក្យគន្លឹះពណ៌។

p {color: # 000000; }

រចនាប័ទ្ម CSS នេះក៏នឹងកំណត់ពណ៌នៃកថាខណ្ឌរបស់អ្នកទៅជាពណ៌ខ្មៅផងដែរពីព្រោះកូដសញ្ញាចុចលេខ 000000 បកប្រែជាពណ៌ខ្មៅ។ អ្នកអាចប្រើអក្សរខ្ទាស់ជាមួយតម្លៃ hex នោះហើយសរសេរវាគ្រាន់តែ #000 ហើយអ្នកនឹងទទួលបានដូចគ្នា។

ដូចដែលយើងបានលើកឡើងរួចហើយតម្លៃដែកគោលដំណើរការល្អនៅពេលដែលអ្នកត្រូវការពណ៌ដែលមិនមែនជាពណ៌ខ្មៅឬស។ នេះគឺជាឧទាហរណ៍:

p {color: # 2f5687; }

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

ចុងក្រោយអ្នកអាចប្រើពណ៌ RGBA សម្រាប់ពណ៌ពុម្ពអក្សរផងដែរ។ ឥឡូវនេះ RGCA ត្រូវបានគាំទ្រនៅក្នុងកម្មវិធីរុករកទំនើបទាំងអស់ដូច្នេះអ្នកអាចប្រើតម្លៃទាំងនេះដោយការព្រួយបារម្ភតិចតួចដែលវានឹងមិនត្រូវបានគាំទ្រនៅក្នុងកម្មវិធីរុករកអ៊ីនធឺណិតទេប៉ុន្តែអ្នកក៏អាចកំណត់ការបម្រុងទុកងាយស្រួលផងដែរ។

p {color: rgba (47,86,135,1); }

តម្លៃ RGBA នេះគឺដូចគ្នាទៅនឹងពណ៌ខៀវដែលបានបញ្ជាក់មុន។ តម្លៃ 3 ដំបូងកំណត់តម្លៃក្រហម, បៃតងនិងខៀវហើយលេខចុងក្រោយគឺការកំណត់អាល់ហ្វា។ វាត្រូវបានកំណត់ទៅ "1" ដែលមានន័យថា "100%" ដូច្នេះពណ៌នេះនឹងគ្មានតម្លាភាពទេ។ ប្រសិនបើអ្នកកំណត់លេខគោលដប់ដូចជា .85 វានឹងបកប្រែទៅជាភាពស្រអាប់ 85% ហើយពណ៌នឹងមានតម្លាភាពបន្តិច។

ប្រសិនបើអ្នកចង់ចាក់គ្រាប់ចុចពណ៌របស់អ្នកអ្នកនឹងធ្វើដូចនេះ:

p {
ពណ៌: # 2f5687;
ពណ៌: rgba (47,86,135,1);
}

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