இந்த கட்டுரையில், CSS ஐப் பயன்படுத்தி கிளிக் நிகழ்வை எவ்வாறு முடக்குவது என்பதைக் கற்றுக்கொள்வோம்.

எனவே, தொடங்குவோம்!

CSS ஐப் பயன்படுத்தி கிளிக் நிகழ்வை எவ்வாறு முடக்குவது?

CSS ஐப் பயன்படுத்தி கிளிக் நிகழ்வுகளை முடக்கலாம். சுட்டி-நிகழ்வுகள் ”சொத்து. ஆனால், அதில் குதித்து, சுருக்கமாக உங்களுக்கு விளக்குவோம்.

'சுட்டி-நிகழ்வுகள்' CSS சொத்து என்றால் என்ன?

' சுட்டி-நிகழ்வுகள் ” தொடுதல் நிகழ்வுக்கு HTML உறுப்புகள் எவ்வாறு பதிலளிக்கின்றன அல்லது செயல்படுகின்றன, அதாவது கிளிக் அல்லது தட்டுதல் நிகழ்வுகள், செயலில் அல்லது மிதவை நிலைகள் மற்றும் கர்சர் தெரியும் அல்லது இல்லையா என்பதைக் கட்டுப்படுத்தவும்.

தொடரியல்
சுட்டி-நிகழ்வுகளின் தொடரியல் பின்வருமாறு:

மேலே குறிப்பிடப்பட்ட சொத்து இரண்டு மதிப்புகளை எடுக்கும், அதாவது ' ஆட்டோ 'மற்றும்' எதுவும் இல்லை ”:

• ஆட்டோ: இயல்புநிலை நிகழ்வுகளைச் செய்ய இது பயன்படுகிறது.
• எதுவும் இல்லை: நிகழ்வுகளை முடக்க இது பயன்படுகிறது.

குறிப்பு: கீழே கொடுக்கப்பட்டுள்ள உதாரணம் இரண்டு செயலில் உள்ள பொத்தான்களை எவ்வாறு சேர்ப்பது என்பதை முதலில் காண்பிக்கும், பின்னர் இரண்டாவது பொத்தானின் கிளிக் நிகழ்வை முடக்குவோம்.

எடுத்துக்காட்டு 1: CSS ஐப் பயன்படுத்தி பொத்தான்களின் நிகழ்வைக் கிளிக் செய்வதை முடக்குதல்
இந்த எடுத்துக்காட்டில், நாம் ஒரு தலைப்பு

மற்றும் இரண்டு பொத்தான்களை உருவாக்குவோம். அடுத்து, ' பொத்தானை 'முதல் பொத்தானின் வகுப்புப் பெயராக, ஒதுக்கவும்' பொத்தானை 'மற்றும்' பொத்தான்2 ” என இரண்டாவது பொத்தானின் வகுப்புகள்.

HTML

< div >
< h1 > CSS ஐப் பயன்படுத்தி நிகழ்வைக் கிளிக் செய்வதை முடக்கவும் < / h1 >
< பொத்தானை வர்க்கம் = 'பொத்தானை' > இயக்கு பொத்தான் < / பொத்தானை >
< பொத்தானை வர்க்கம் = 'பொத்தான் பொத்தான்2' > முடக்கு பொத்தான் < / பொத்தானை >
< / div >

CSS இல், ' .பொத்தானை ” HTML கோப்பில் உருவாக்கப்பட்ட இரண்டு பொத்தான்களையும் அணுக பயன்படுகிறது. அடுத்து, பார்டர் ஸ்டைலை “ என அமைக்கவும் எதுவும் இல்லை ” மற்றும் திணிப்பு கொடுக்கவும் “ 25px ”. அதன் பிறகு, பொத்தான் உரையின் நிறத்தை “” என அமைக்கவும். rgb(29, 6, 31) ” மற்றும் பொத்தான் பின்னணி “ rgb(19, 192, 163) ”. ஒரு பொத்தானின் ஆரம் '' என அமைப்போம் 5px ”.

CSS

.பொத்தானை {
எல்லை : எதுவும் இல்லை ;
திணிப்பு : 25px ;
நிறம் : rgb ( 29 , 6 , 31 ) ;
பின்னணி நிறம் : rgb ( 19 , 192 , 163 ) ;
எல்லை-ஆரம் : 5px ;
}

அதன் பிறகு, இரண்டு பொத்தான்களிலும்: செயலில் உள்ள போலி-வகுப்பைப் பயன்படுத்துவோம் ' .பொத்தான்:செயலில் ” மற்றும் பொத்தானின் நிறத்தை “ என அமைக்கவும் rgb(200, 255, 0) ”:

.பொத்தானை : செயலில் {
பின்னணி நிறம் : rgb ( 209 , 65 , 65 ) ;
}

இதன் விளைவாக, பின்வரும் முடிவை நீங்கள் காண்பீர்கள்:

இப்போது, ​​நாம் அடுத்த பகுதிக்குச் செல்வோம், அதில் இரண்டாவது பொத்தானின் கிளிக் நிகழ்வை முடக்குவோம்.

இதைச் செய்ய, பயன்படுத்தவும் ' .பொத்தான்2 ' HTML கோப்பில் உருவாக்கப்பட்ட இரண்டாவது பொத்தானை அணுகவும், அதன் பிறகு, சுட்டிக்காட்டி-நிகழ்வுகளின் சொத்தின் மதிப்பை அமைக்கவும் ' எதுவும் இல்லை ”:

.பொத்தான்2 {
சுட்டி-நிகழ்வுகள் : எதுவும் இல்லை ;
}

சுட்டி-நிகழ்வுகள் பண்புகளைப் பயன்படுத்தி அதன் மதிப்பை அல்லாததாக அமைப்பது கிளிக் நிகழ்வை முடக்கும், அதை பின்வரும் வெளியீட்டில் காணலாம்:

CSS ஐப் பயன்படுத்தி கிளிக் நிகழ்வை முடக்குவதற்கான எளிதான முறையை நாங்கள் வழங்கியுள்ளோம்.

முடிவுரை

HTML இல் கிளிக் நிகழ்வை முடக்க, ' சுட்டி-நிகழ்வுகள் 'CSS இன் சொத்து பயன்படுத்தப்படுகிறது. இந்த நோக்கத்திற்காக, ஒரு HTML உறுப்பைச் சேர்த்து, சுட்டிக்காட்டி-நிகழ்வுகளின் சொத்தின் மதிப்பை ' எதுவும் இல்லை ” அதன் கிளிக் நிகழ்வை முடக்க. CSS ஐப் பயன்படுத்தி கிளிக் நிகழ்வை அதன் உதாரணத்துடன் எவ்வாறு முடக்குவது என்பதை இந்தக் கட்டுரை விளக்கியது.