ரெஸ்பான்சிவ் வெப் டிசைன் அறிமுகமானதிலிருந்து, டெவலப்பர்கள், பிரவுசரின் வியூபோர்ட் அளவை அடிப்படையாகக் கொள்வதற்குப் பதிலாக, DOM உறுப்புகளை அவற்றின் உண்மையான அளவின் அடிப்படையில் வடிவமைக்கும் திறனை ( மீடியா குவெரிகளைப் பயன்படுத்தி) கேட்டு வருகின்றனர். உண்மையில், கண்டெய்னர் குவெரிகள் (முதலில் எலிமென்ட் குவெரிகள்) தான், பிரவுசர்களில் இன்னும் இல்லாத, மிகவும் கோரப்பட்ட CSS அம்சமாக இருக்கலாம்.
CSS இல் கொள்கலன் வினவல்களைச் செயல்படுத்துவது ஏன் கடினம் மற்றும் உலாவி உற்பத்தியாளர்கள் ஏன் அவற்றைச் செயல்படுத்தத் தயங்குகிறார்கள் என்பதை விளக்கும் பல , பல , பல பதிவுகள் ஏற்கனவே உள்ளன. நீங்கள் இப்போது அதை அனுபவிக்க விரும்பினால், கொஞ்சம் ஜாவாஸ்கிரிப்ட் உதவலாம்:
c51c33e1533e68c3f8fd24633700789f
பின்னர் முழு விஷயமும் இப்படித்தான் தெரிகிறது:
See the Pen by David Vielhuber (@vielhuber) on CodePen.
பிரேக் பாயிண்ட்ஸ் , செலக்டர் மற்றும் ஸ்டைல் பண்புகளை பல்வேறு பிரேக் பாயிண்டுகள், தானியங்கி தேர்வாளர் மற்றும் சேர்க்கப்பட்ட வகுப்புகளின் வகையை வரையறுக்க பயன்படுத்தலாம். நீங்கள் ஸ்கிரிப்டைப் பயன்படுத்துகிறீர்கள் என்றால், புதிதாக உருவாக்கப்பட்ட வகுப்புகளை நீங்கள் பின்வருமாறு உரையாற்றலாம்:
c51c33e1533e68c3f8fd24633700789f
மேலடுக்குகள், பாப்அப்கள், பக்கப்பட்டிகள் அல்லது தனிப்பயன் கூறுகளில் உள்ள உறுப்புகளுக்கு கொள்கலன் வினவல்களைப் பயன்படுத்துவது மிகவும் பயனுள்ளது - இப்போதும் கூட, எடுத்துக்காட்டாக, மேலே உள்ள ஸ்கிரிப்ட்.