வலை வடிவமைப்பாளர்கள் நீண்டகாலமாக காட்சிக்கு வந்தபோது அவர்கள் உருவாக்கிய பக்கங்கள் மீது அதிகமான கட்டுப்பாட்டைக் கொண்டிருந்தனர். CSS3 இல் அறிமுகப்படுத்தப்பட்ட புதிய பாங்குகள் இணைய நிபுணர்களுக்கு தங்கள் பக்கங்களுக்கு ஃபோட்டோஷாப் போன்ற விளைவுகளை சேர்க்கும் திறனை வழங்கின. இதில் துளி நிழல்கள் மற்றும் ஒளிர்வுகள், வட்ட முனைகள் மற்றும் இன்னும் பல அம்சங்களும் அடங்கும். CSS3 ஆனது அனிமேஷன் போன்ற அம்சங்களை அறிமுகப்படுத்தியது, இது தளங்களில் நல்ல செயல்திறனை உருவாக்க பயன்படுகிறது.
நீங்கள் CSS3 பயன்படுத்தி உங்கள் வலைத்தளத்தில் கூறுகளை சேர்க்க முடியும் ஒரு மிக நல்ல காட்சி விளைவு அவர்கள் ஒளிபுகா மற்றும் மாற்றம் பண்புகள் இணைந்து பயன்படுத்தி மங்காது மற்றும் வெளியே செய்ய உள்ளது. இது ஒரு பார்வையாளர் ஏதோ ஒன்றைச் செய்யும் போது கவனத்தை ஈர்க்கும் வண்ணமயமான இடங்களை உருவாக்குவதன் மூலம் உங்கள் பக்கங்களை இன்னும் ஊடாடும் வகையில் எளிதான மற்றும் நன்கு ஆதரிக்கக்கூடிய வழியாகும்.
உங்கள் இணைய பக்கங்களில் உள்ள பல்வேறு உறுப்புகளுடனான இந்த ஊடாடும் காட்சி விளைவைச் சேர்க்க எவ்வளவு எளிது என்பதைப் பார்ப்போம்.
ஹோவர் மீது தன்மை மாற்று
ஒரு வாடிக்கையாளர் அந்த உறுப்பு மீது ஏற்றி போது ஒரு படத்தை ஒளிபுகாநிலையை மாற்ற எப்படி பார்க்க தொடங்குவோம். இந்த எடுத்துக்காட்டுக்கு (HTML கீழே காட்டப்பட்டுள்ளது) நாம் ஒரு வர்க்கத்தை பண்புக்கூறுடன் பயன்படுத்துகிறோம்
greydout.
அதை வெளியே கிரியேட்டட் செய்ய, நாங்கள் எங்கள் CSS நடைதாளுடன் பின்வரும் பாணி விதிகள் சேர்க்க: .greydout {-webkit-opacity: 0.25;-moz-opacity: 0.25;ஒளிபுகாநிலை: 0.25;}
இந்த ஒளிர்வு அமைப்புகள் 25% வரை மொழிபெயர்க்கப்படுகின்றன. அதன் பொருள் அதன் சாதாரண வெளிப்படைத்தன்மையின் 1/4 என காட்டப்படும். எந்த வெளிப்படைத்தன்மையுடனும் முழுமையாக ஒபாமா 100% இருக்கும் போது 0% முற்றிலும் வெளிப்படையானதாக இருக்கும். அடுத்து, படத்தை சுலபமாக (அல்லது மிகவும் துல்லியமாக, முழுமையாக ஒளிபுகா ஆக) தெளிவான வரம்பை சுட்டி போது அதை நீட்டி, : மிதவைபோலி வர்க்கம்: .greydout: hover {-webkit-opacity: 1;-moz-opacity: 1;ஒளிர்வு: 1;}
நீங்கள் இந்த உலாவிகளின் பழைய பதிப்புகளுக்கு பின்தங்கிய இணக்கத்தன்மையை உறுதிப்படுத்துவதற்காக, இந்த எடுத்துக்காட்டுகளுக்கு, விற்பனையாளர் முன்னுரிமையுள்ள பதிப்புகளைப் பயன்படுத்துகின்றீர்கள் என்பதை நீங்கள் கவனிப்பீர்கள். இந்த ஒரு நல்ல நடைமுறையில் போது, உண்மையில் ஒளிபுகா ஆட்சி இப்போது உலாவிகளில் ஆதரவு மற்றும் அது அந்த விற்பனையாளர் முன்னொட்டு வரிகளை கைவிட மிகவும் பாதுகாப்பானது என்று ஆகிறது. இருப்பினும், பழைய உலாவி பதிப்புகளுக்கான ஆதரவை உறுதிப்படுத்த விரும்பினால், இந்த முன்னொட்டுகளை சேர்க்கக்கூடாது. சாதாரணமான, பிரம்மாண்டமான பதிப்பில் பாணியில் முடிவெடுக்கும் சிறந்த நடைமுறையை பின்பற்றுவதை உறுதி செய்யுங்கள். நீங்கள் ஒரு தளத்தில் இந்த வரிசைப்படுத்தியிருந்தால், இந்த ஒத்த தன்மை சரிசெய்தல் மிகவும் திடீரென்று மாற்றமடைவதை நீங்கள் காணலாம். முதலாவதாக, அது சாம்பல் தான், பின்னர் அந்த இருவருக்கும் இடையில் இடைக்கால மாநிலங்கள் இல்லை. ஒரு ஒளி சுவிட்ச் போல - அல்லது அணை. இது உங்களுக்கு என்னவாக இருக்கலாம், ஆனால் நீங்கள் படிப்படியாக மாற்றக்கூடிய ஒரு மாற்றத்துடன் முயற்சிக்கலாம். ஒரு நல்ல விளைவு சேர்க்க மற்றும் இந்த ஃபேட் படிப்படியாக செய்ய, நீங்கள் சேர்க்க வேண்டும் மாற்றம்
சொத்து .greydoutவர்க்கம்: .greydout {-webkit-opacity: 0.25;-moz-opacity: 0.25;ஒளிபுகாநிலை: 0.25;-webkit- மாற்றம்: அனைத்து 3s எளிதாக;-எம்ஒஸ்-மாற்றம்: அனைத்து 3s எளிதாக;-ms-transition: அனைத்து 3s எளிதாக;-ஓ-மாற்றம்: அனைத்து 3s எளிதாக;மாற்றம்: அனைத்து 3s எளிதாக;}
