របៀបបង្កើតត្រីកោណជា CSS: វិធីងាយបំផុត

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

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

ការអនុវត្តក្នុងការរចនាគេហទំព័រ

នៅក្នុងការរចនាគេហទំព័រត្រីកោណត្រូវបានរកឃើញគ្រប់ទីកន្លែង។ ពួកវាបង្កើតជាគន្លឹះ, ម៉ឺនុយ, ប្រភេទទាំងអស់នៃធាតុនៃចំណុចប្រទាក់អ្នកប្រើ។ ពេលខ្លះពួកវាត្រូវបានប្រើនៅពេលបង្កើតសូចនាករនៃដំណើរការចាប់ផ្ដើម។ ហើយប្រសិនបើវាអាចធ្វើទៅបានដោយគ្មានពួកគេពីមុនទេឥឡូវនេះវាមិនអាចទៅរួចនោះទេហើយអ្នកអភិវឌ្ឍន៍ត្រូវមានកាតព្វកិច្ចសម្របទៅនឹងតម្រូវការបែបនេះ។ យ៉ាងណាមិញថ្ងៃនេះត្រីកោណដែលបង្កើតឡើងដោយ CSS គឺជាផ្នែកសំខាន់បំផុតក្នុងការបង្កើតទំនាក់ទំនងរវាងគ្នាទៅវិញទៅមករវាងផ្នែកនៃចំណុចប្រទាក់និងការបង្រួបបង្រួមចូលគ្នាតែមួយ។

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

របៀបបង្កើតដោយប្រើស៊ុម

វិធីសាស្ត្រដំបូងដែលអនុញ្ញាតឱ្យអ្នកបង្កើតត្រីកោណនៅក្នុង CSS គឺជាស៊ុម។ វាគឺដើម្បីប្រើគ្រោងការណ៍មួយ។ ទោះបីជាការពិតដែលថាព្រំដែនដែលត្រូវបានបង្កើតឡើងដោយប្រើលក្ខណៈស៊ុមមិនទាក់ទងដោយផ្ទាល់ទៅនឹងត្រីកោណវាត្រូវបានគេប្រើញឹកញាប់បំផុតសម្រាប់គោលបំណងនេះ។

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

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

• ត្រីកោណដែលក្រឡេកមើលទៅខាងឆ្វេងដែលភាគីទាំងអស់ស្មើគ្នា។
• ត្រីកោណមួយដែលមើលទៅខាងឆ្វេងនិងត្រូវបានរុញភ្ជាប់។
• ត្រីកោណវែងដែលមើលទៅខាងឆ្វេង;
• ត្រីកោណកែង មួយដែលមានជ្រុងខាងស្តាំនៅខាងឆ្វេង។
• ត្រីកោណកំពុងមើលចុះ
• ត្រីកោណកំពុងសម្លឹងរកមើល
• ត្រីកោណមួយកំពុងរកមើលខាងស្ដាំនិងពូជជាច្រើនទៀត។

ការប្រើពាក្យគន្លឹះ

ជាមួយនឹងបច្ចេកទេសទាំងនេះអ្នកអាចបង្កើតជ្រុងនៅក្នុងព័ត៌មានជំនួយលេចឡើងនិងការណែនាំ។ ក្នុងគោលបំណងដើម្បីភ្ជាប់ត្រីកោណមួយទៅប្លុកតាមរយៈ CSS, អ្នកសរសេរកម្មវិធីភាគច្រើនប្រើធាតុដូចគ្នានេះបន្ទាប់ពីនិងមុន។ ប្រសិនបើអ្នកប្រើវារួមគ្នាអ្នកអាចគូរត្រីកោណនៅក្នុង CSS ដែលមានដាច់សរសៃឈាមខួរក្បាល។

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

គុណសម្បត្តិនៃការប្រើប្រាស់ក្របខ័ណ្ឌ CSS ដើម្បីបង្កើតត្រីកោណគឺ:

• កែសម្រួលរហ័សនិងងាយស្រួលនៃទំហំនិងពណ៌ដោយប្រើលក្ខណៈសម្បត្តិ;
• គាំទ្រកម្មវិធីរុករកទាំងអស់។

គុណវិបត្តិ:

• ដោយសារតែស៊ុមត្រូវបានប្រើ, មិនមានលទ្ធភាពដើម្បីអនុវត្តជម្រាល, ស្រមោល;
• ជួនកាលនៅពេលអ្នកប្រើមើលទំព័រក្នុងកម្មវិធីរុករក Firefox ភាពថ្លាអាចមិនដំណើរការហើយនេះនឹងធ្វើឱ្យខូចរូបភាព។

ប្រើរូបភាពដែលបានបញ្ចប់

វិធីសាស្ត្របន្ទាប់នៃការបង្កើតត្រីកោណគឺត្រូវប្រើរូបភាពដែលបានអ៊ិនកូដ។ ត្រីកោណត្រូវបានទាញជាមុននៅក្នុងកម្មវិធីនិពន្ធក្រាហ្វិកហើយត្រូវបានបម្លែងទៅជាកូដពិសេសដោយប្រើសេវាកម្មឯកទេស។

វិធីបូកនៃវិធីសាស្រ្តនេះគឺថាអ្នកអាចបង្កើតការរចនាដ៏ស្រស់ស្អាតជាមួយនឹងស្រមោលជម្រាលនិងស៊ុមហើយបន្ទាប់មកគ្រាន់តែកូដវាទាំងអស់។ និងគុណវិបត្តិគឺថាមិនមែនគ្រប់គ្នាសុទ្ធតែដឹងកម្មវិធីក្រាហ្វិកល្អនោះទេ។ លើសពីនេះទៀតប្រសិនបើរូបភាពមានទំហំធំនោះបន្ទាត់នៃកូដគឺធំធេងណាស់។ នេះគឺជាការរអាក់រអួលសម្រាប់អ្នកអភិវឌ្ឍន៍។

ចំណុចដាច់ដោយឡែកគឺការប្រើកម្មវិធីរុករកអ៊ីនធឺណិតចាស់ជាងនេះ។ នៅក្នុងពួកគេ, វិធីសាស្រ្តនេះជាធម្មតានឹងមិនធ្វើការ។

វិធីសាស្ត្រការ៉េបញ្ច្រាស

មធ្យោបាយមួយគឺបង្កើតការេដែលមានរាងជា CSS ។ ត្រូវការប្លុកពីរនៅទីនេះ។ ប៉ុន្តែមនុស្សមួយចំនួនប្រើប្រាស់ធាតុក្លែងក្លាយ។

ទីមួយការ៉េត្រូវបានបង្កើត។ វានឹងជាមាតិកានៃធាតុបង្វិល។ បន្ទាប់មកវាត្រូវបានបង្វិល 45 អង្សាដើម្បីធ្វើឱ្យវាមើលទៅដូចពេជ្រ។ បន្ទាប់មកវាផ្លាស់ប្តូរឡើងហើយប្លុកខាងក្រៅត្រូវបានលាក់ដោយប្រើលើសចំណុះ: លក្ខណៈសម្បត្តិដែលបានលាក់។ ដំណោះស្រាយនេះក៏មិនមែនឆ្លងកាត់កម្មវិធីរុករកដែរហើយជួនកាលរូបភាពនឹងមិនត្រូវបានបង្ហាញទេប្រសិនបើអ្នកចង់បាន។

លទ្ធផល

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

សម្រាប់អ្នកទាំងឡាយណាដែលមិនចង់ចូលទៅក្នុងកម្មវិធីនិងមើលថត CSS មានអ្នកសរសេរលើបណ្តាញដែលបង្កើតត្រីកោណទំហំនិងពណ៌ត្រឹមត្រូវ។ នៅក្នុង កម្មវិធីនិពន្ធដែលមើលឃើញ អ្នកប្រើជ្រើសនិងលៃតម្រូវប៉ារ៉ាម៉ែត្ររូបរាងទាំងអស់។ បានបម្លែងទៅជាម៉ាស៊ីនបង្កើតត្រីកោណកូដដាក់ក្នុងបង្អួចដាច់ដោយឡែកមួយដោយផ្ទាល់។ បន្ទាប់មកកូដដែលបានបង្កើតត្រូវបានបញ្ចូលទៅក្នុងសន្លឹករចនាប័ទ្មនិងត្រូវបានគេសម្រួលទៅនឹងការរចនាទំព័រ។