CSS வடிகட்டிகள் என்றால் என்ன?

CSS வடிப்பான்கள் ஒரு உறுப்புக்கு மங்கலான அல்லது வண்ண மாற்றுதல் போன்ற வரைகலை விளைவுகளைப் பயன்படுத்த உங்களை அனுமதிக்கின்றன. அவை பொதுவாக படங்கள், பின்னணிகள் மற்றும் எல்லைகளுக்கு பயன்படுத்தப்படுகின்றன.

வெளிப்புற பட எடிட்டிங் கருவிகளின் தேவை இல்லாமல் காட்சி விளைவுகளை உருவாக்க, படங்களை மேம்படுத்த அல்லது தனித்துவமான வடிவமைப்பு கூறுகளை உருவாக்க வடிப்பான்கள் பயன்படுத்தப்படலாம்.

ஆதரிக்கப்படும் CSS வடிகட்டி பண்புகள்

• blur()- உறுப்புக்கு ஒரு காஸியன் மங்கலைப் பயன்படுத்துகிறது.
• brightness()- உறுப்பின் பிரகாசத்தை சரிசெய்கிறது.
• contrast()- உறுப்பு மாறுபாடு சரிசெய்கிறது.
• grayscale()- உறுப்பை கிரேஸ்கேலாக மாற்றுகிறது.
• hue-rotate()- உறுப்புக்கு ஒரு சாயல் சுழற்சியைப் பயன்படுத்துகிறது.
• invert()- உறுப்புகளின் வண்ணங்களை தலைகீழாக மாற்றுகிறது.
• opacity()- உறுப்பின் ஒளிபுகாநிலையை சரிசெய்கிறது.
• saturate()- உறுப்பு நிறைவுற்றது அல்லது சிதைக்கிறது.
• sepia()- தனிமத்தை செபியாவாக மாற்றுகிறது.

வடிப்பான்களை எவ்வாறு பயன்படுத்துவது

இந்த கருவியால் உருவாக்கப்பட்ட CSS குறியீட்டைப் பயன்படுத்தி, நீங்கள் எந்த HTML உறுப்புக்கும் வடிப்பான்களைப் பயன்படுத்தலாம். எப்படி என்பது இங்கே:

.filtered-image { filter: blur(5px) brightness(110%) contrast(120%); }

filter: blur(2px) brightness(110%) contrast(120%) saturate(150%);

உலாவி இணக்கத்தன்மை

Chrome, Firefox, Safari, Edge மற்றும் Opera உள்ளிட்ட நவீன உலாவிகளில் CSS வடிப்பான்கள் பரவலாக ஆதரிக்கப்படுகின்றன. இருப்பினும், இன்டர்நெட் எக்ஸ்ப்ளோரர் போன்ற பழைய உலாவிகள் அவற்றை ஆதரிக்காது.