វិធីលាក់តំណដោយប្រើ CSS

ការលាក់តំណភ្ជាប់ជាមួយ CSS អាចត្រូវបានធ្វើឡើងតាមវិធីមួយចំនួនប៉ុន្តែយើងនឹងពិនិត្យមើលវិធីពីរដែល URL អាចត្រូវបានលាក់ទាំងស្រុងពីទិដ្ឋភាព។ ប្រសិនបើអ្នកចង់បង្កើតការប្រមាញ់ប្រមាញ់ឬស៊ុតទន្សាយនៅលើវែបសាយរបស់អ្នកនេះជាវិធីគួរឱ្យចាប់អារម្មណ៍មួយដើម្បីលាក់តំណភ្ជាប់។

មធ្យោបាយទី 1 គឺដោយប្រើ "គ្មាន" ជាតម្លៃព្រាង CSS property triangle ។ ផ្សេងទៀតគឺដោយគ្រាន់តែពណ៌អត្ថបទដើម្បីផ្គូផ្គងផ្ទៃខាងក្រោយនៃទំព័រ។

សូមចងចាំថាវិធីសាស្ដ្រណាមួយមិនធ្វើឱ្យតំណភ្ជាប់បាត់ទាំងស្រុងពីការរកឃើញនៅពេលស្វែងរកកូដប្រភព។ ទោះជាយ៉ាងណាក៏ដោយភ្ញៀវទេសចរនឹងមិនមានវិធីសាមញ្ញនិងងាយស្រួលក្នុងការមើលវាទេហើយអ្នកទស្សនាថ្មីរបស់អ្នកនឹងមិនមានតម្រុយពីរបៀបស្វែងរកតំណនោះទេ។

ចំណាំ: ប្រសិនបើអ្នកកំពុងស្វែងរកការណែនាំអំពីរបៀបភ្ជាប់សន្លឹករចនាបថខាងក្រៅសេចក្ដីណែនាំទាំងនេះមិនមែនជាអ្វីដែលអ្នកមានទេ។ មើល តើសន្លឹករចនាប័ទ្មខាងក្រៅជាអ្វី? ជំនួស។

បិទដំណើរការព្រឹត្តិការណ៍ព្រួញ

វិធីសាស្រ្តដំបូងដែលយើងអាចប្រើដើម្បីលាក់ URL គឺធ្វើឱ្យតំណភ្ជាប់មិនធ្វើអ្វីទាំងអស់។ នៅពេលដែលកណ្តុរឃោរឃៅលើតំណនោះវានឹងមិនបង្ហាញអ្វីដែល URL ចង្អុលហើយវានឹងមិនអនុញ្ញាតឱ្យអ្នកចុចវាទេ។

សរសេរ HTML ត្រឹមត្រូវ

ទំព័របណ្ដាញមួយត្រូវប្រាកដថាតំណខ្ពស់អានដូចនេះ:

ThoughtCo.com

ជាការពិតណាស់ "HTTP://www.thoughtco.com/" ត្រូវចង្អុលទៅ URL ពិតប្រាកដដែលអ្នកចង់លាក់ហើយ ThoughtCo.com អាចត្រូវបានប្តូរទៅជាពាក្យឬឃ្លាណាមួយដែលអ្នកចូលចិត្តនោះពិពណ៌នាអំពីតំណ។

គំនិតនៅទីនេះគឺថាសកម្មភាពថ្នាក់នឹងត្រូវបានប្រើជាមួយ CSS ខាងក្រោមដើម្បីបិទតំណ។

ប្រើកូដ CSS នេះ

លេខកូដ CSS ចាំបាច់ត្រូវដោះស្រាយជាមួយថ្នាក់ដែលសកម្មនិងពន្យល់ទៅកម្មវិធីរុករកថាព្រឹត្តការណ៍នៅលើតំណភ្ជាប់ចុច "គ្មាន" ដូចនេះ:

.active {pointer-events: none; ទស្សន៍ទ្រនិច: លំនាំដើម }

អ្នកអាចមើលឃើញវិធីសាស្រ្តនេះនៅក្នុងសកម្មភាពជាងនៅ JSFiddle ។ ប្រសិនបើអ្នកលុបកូដ CSS នៅទីនោះហើយបន្ទាប់មកដំណើរការទិន្នន័យម្តងទៀតនោះតំណភ្ជាប់ស្រាប់តែអាចចុចបាននិងអាចប្រើបាន។ នេះគឺដោយសារតែនៅពេលដែល CSS មិនត្រូវបានអនុវត្តនោះតំណភ្ជាប់នឹងជាធម្មតា។

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

ប្តូរពណ៌របស់តំណ

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

កំណត់ថ្នាក់ផ្ទាល់ខ្លួន

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

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

ThoughtCo.com

ស្វែងរកពណ៌អ្វីដែលត្រូវប្រើ

មុនពេលយើងបញ្ចូលកូដ CSS សមរម្យដើម្បីលាក់តំណភ្ជាប់យើងត្រូវរកពណ៌ដែលយើងចង់ប្រើ។ ប្រសិនបើអ្នកមានផ្ទៃខាងក្រោយដ៏រឹងមាំរួចទៅហើយ, ដូចជាពណ៌សឬខ្មៅ, នោះហើយជាងាយស្រួល។ ទោះជាយ៉ាងណាក៏ដោយពណ៌ពិសេសដទៃទៀតត្រូវតែត្រឹមត្រូវផងដែរ។

ឧទាហរណ៍ប្រសិនបើពណ៌ផ្ទៃខាងក្រោយរបស់អ្នកមានតម្លៃគោលដប់ប្រាំមួយនៃ e6ded1 អ្នកត្រូវដឹងថាសម្រាប់កូដ CSS ដំណើរការត្រឹមត្រូវសម្រាប់ទំព័រដែលអ្នកចង់ឱ្យវាបាត់។

មានឧបករណ៍ "រើសពណ៌" ឬ "ឧបករណ៍ចាក់ពណ៌" ជាច្រើនដែលមួយក្នុងចំណោមនេះត្រូវបានគេហៅថា ColorPick Eyedropper សម្រាប់កម្មវិធីរុករក Chrome ។ ប្រើវាដើម្បីស្រង់ពណ៌ផ្ទៃខាងក្រោយនៃទំព័របណ្ដាញរបស់អ្នកដើម្បីទទួលពណ៌គោលដប់ប្រាំមួយ។

ប្ដូរតាមបំណង CSS ដើម្បីផ្លាស់ប្តូរពណ៌

ឥឡូវនេះអ្នកមានពណ៌ដែលតំណគួរតែមាន, វាជាពេលវេលាដើម្បីប្រើថានិងតម្លៃថ្នាក់ផ្ទាល់ខ្លួនពីខាងលើ, ដើម្បីសរសេរកូដ CSS:

.hideme {color: # e6ded1; }

ប្រសិនបើពណ៌ផ្ទៃខាងក្រោយរបស់អ្នកមានលក្ខណៈសាមញ្ញដូចជាពណ៌សឬបៃតងអ្នកមិនចាំបាច់ដាក់សញ្ញា # នៅពីមុខវាទេ:

.hideme {color: white; }

សូមមើលគំរូគំរូវិធីសាស្រ្តនេះនៅក្នុង JSFiddle នេះ។