સમય આવી શકે છે, કારણ કે તમે વેબપૃષ્ઠોના વિકાસ પર કામ કરો છો, કે તમારે વસ્તુઓના વિશિષ્ટ ક્ષેત્રો "એક અથવા બીજાં કારણોસર છુપાવવા" ની જરૂર છે. તમે, અલબત્ત, ફક્ત HTML માર્કઅપના પ્રશ્નોમાં આઇટમ (ઓ) ને દૂર કરી શકો છો, પણ જો તમે તેમને કોડમાં રહેવા માંગતા હો, પરંતુ ગમે તે કારણોસર બ્રાઉઝર સ્ક્રીન પર પ્રદર્શિત ન કરો (અને અમે કારણોની સમીક્ષા કરીશું ટૂંક સમયમાં આ કરવું) તમારા HTML માં એક ઘટક રાખવા માટે, પરંતુ તેને પ્રદર્શિત કરવા માટે છુપાવો, તમે CSS પર ચાલુ કરશો.
HTML માં જે ઘટકને છુપાવવા માટેના બે સૌથી સામાન્ય રીતો "પ્રદર્શન" અથવા "દૃશ્યતા" માટેના CSS ગુણધર્મોનો ઉપયોગ કરશે. પ્રથમ નજરમાં, આ બે ગુણધર્મો મોટેભાગે સમાન વસ્તુ કરવા લાગે છે, પરંતુ દરેકમાં અલગ તફાવત છે જે તમને જાણ થવો જોઈએ. ચાલો ડિસ્પ્લે વચ્ચે તફાવત પર નજર કરીએ: કંઈ અને દ્રશ્યતા: છુપી.
દ્રશ્યતા
સીએસએસ ગુણધર્મ / મૂલ્યની દૃશ્યતાના મૂલ્યનો ઉપયોગ: છુપાવેલા બ્રાઉઝરમાંથી એક ઘટક છુપાવે છે. તેમ છતાં, તે છુપાયેલા તત્વ હજી પણ લેઆઉટમાં જગ્યા લે છે. એવું છે કે તમે મૂળભૂત રીતે તત્વ અદૃશ્ય બનાવી દીધું છે, પરંતુ તે હજુ પણ સ્થાને રહે છે અને તે જે જગ્યા લે છે તે લે છે, તે એકલી રહી છે.
જો તમે તમારા પૃષ્ઠ પર એક DIV મૂકો છો અને તેને 100x100 પિક્સેલ્સ લેવા માટે પરિમાણ આપવા માટે CSS નો ઉપયોગ કરો છો, તો દૃશ્યતા: છુપાવેલ સંપત્તિ સ્ક્રીન પર DIV દર્શાવશે નહીં, પરંતુ તે પછીનું ટેક્સ્ટ કાર્ય કરશે જેમ તે હજુ પણ ત્યાં છે, તે બદલ 100x100 અંતર
પ્રામાણિકપણે, દ્રશ્યતા મિલકત કંઈક છે જે અમે વારંવાર ઉપયોગ કરી નથી, અને ચોક્કસપણે તેના પર નથી જો અમે અન્ય CSS પ્રોપર્ટીઝનો ઉપયોગ કરી રહ્યા છીએ જેમ કે ચોક્કસ ઘટક માટે અમે ઇચ્છતા લેઆઉટ પ્રાપ્ત કરવા માટે પૉઝીંગિંગ, તો અમે તે વસ્તુને શરૂઆતમાં છુપાવવા માટે દૃશ્યતાનો ઉપયોગ કરી શકીએ છીએ, માત્ર હોવર પર તેને "ચાલુ કરો" તે આ મિલકતનો એક સંભવિત ઉપયોગ છે, પરંતુ ફરી, તે કોઈ પણ આવર્તન સાથે ચાલુ નથી.
ડિસ્પ્લે
દૃશ્યતા સંપત્તિથી વિપરીત, જે સામાન્ય દસ્તાવેજ પ્રવાહમાં એક તત્વ છોડે છે, પ્રદર્શન: કોઈ પણ દસ્તાવેજથી તત્વને સંપૂર્ણપણે દૂર કરે છે. તે કોઈપણ જગ્યા લેતી નથી, તેમ છતાં તે માટે HTML સ્રોત કોડમાં છે. આ તે છે, કારણ કે તે ખરેખર દસ્તાવેજના પ્રવાહમાંથી દૂર છે. તમામ હેતુઓ અને હેતુઓ માટે, આઇટમ ગઇ છે. તમારા હેતુઓ શું છે તેના આધારે આ સારી વસ્તુ અથવા ખરાબ વસ્તુ હોઇ શકે છે. જો તમે આ મિલકતનો દુરુપયોગ કરો છો તો તે તમારા પૃષ્ઠને નુકસાન કરી શકે છે!
પૃષ્ઠની ચકાસણી કરતી વખતે અમે વારંવાર "પ્રદર્શન: કોઈ નહીં" નો ઉપયોગ કરીએ છીએ જો આપણે કોઈ વિસ્તાર માટે "થોડી દૂર" જવાની જરૂર છે, જેથી અમે પૃષ્ઠના અન્ય વિસ્તારોની ચકાસણી કરી શકીએ, આપણે પ્રદર્શનનો ઉપયોગ કરી શકીએ: તે માટે કોઈ નહીં. યાદ રાખવું તે વસ્તુ છે, તેમ છતાં એ છે કે તે સાઇટના વાસ્તવિક લોન્ચ પહેલાં પેજ પર પાછું પરત કરવું જોઈએ. આ કારણ છે કે આ પદ્ધતિમાં દસ્તાવેજ ફ્લોમાંથી દૂર કરવામાં આવેલી વસ્તુ શોધ એન્જિન અથવા સ્ક્રીન રીડર દ્વારા જોઈ શકાતી નથી, તેમ છતાં તે HTML માર્કઅપમાં રહી શકે છે. ભૂતકાળમાં, આ પદ્ધતિનો ઉપયોગ શોધ એંજિન રેંકિંગ્સને પ્રભાવિત કરવા માટે કાળી ટોપી પદ્ધતિ તરીકે કરવામાં આવ્યો હતો, તેથી જે વસ્તુઓ પ્રદર્શિત થતી નથી તે Google માટે શા માટે તે અભિગમનો ઉપયોગ કરવામાં આવે છે તે માટે એક લાલ ધ્વજ હોઈ શકે છે.
અમે ડિસ્પ્લે શોધીએ છીએ તે એક રસ્તો: કોઈ પણ ઉપયોગી નથી, અને જ્યાં અમે તેનો ઉપયોગ જીવંત, ઉત્પાદન વેબસાઇટ્સ પર કરીએ છીએ ત્યારે તે એક પ્રતિસાદી સાઇટ બનાવી રહી હોય છે જેમાં એવા ઘટકો હોઈ શકે છે કે જે એક ડિસ્પ્લે કદ માટે ઉપલબ્ધ છે પરંતુ અન્ય લોકો માટે નહીં. તમે પ્રદર્શનનો ઉપયોગ કરી શકો છો: તે ઘટકને છુપાવવા માટે કંઈ નહી કરો અને પછી પછીથી મીડિયા ક્વેરીઝ સાથે તેને પાછું ફેરવો આ ડિસ્પ્લેનો સ્વીકાર્ય ઉપયોગ છે: કોઈ નહીં, કારણ કે તમે નૈતિક કારણોસર કાંઈ છુપાવવા માટે પ્રયાસ કરી રહ્યા નથી, પરંતુ આવું કરવાની કાયદેસર જરૂર છે.
જેનિફર કિનાન દ્વારા મૂળ લેખ. 3/3/17 ના રોજ જેરેમી ગીરર્ડ દ્વારા સંપાદિત