CSS-де «дисплей: жоқ» және «көрінетін: жасырын» арасындағы айырмашылық

Веб-беттерді әзірлеуде жұмыс істеп жатқаныңыздай, бірнеше себептермен элементтердің нақты бағыттарын «жасыру» қажет болуы мүмкін. Сіз, әрине, HTML түзетулерінен сұрақтардағы элементтерді алып тастай аласыз, бірақ егер олар кодта қалғыңыз келсе, бірақ қандай да бір себептермен браузер экранында көрсетілмеген болса (және біз себептерді мұны тез арада орындаңыз). HTML элементіңізді ұстап тұру үшін, оны көрсету үшін жасырыңыз, сіз CSS-ге хабарласыңыз.

HTML-дегі элементті жасырудың ең кең таралған жолдары «көрсету» немесе «көріну» үшін CSS сипаттарын пайдаланатын болады. Бір қарағанда, бұл екі қасиет бірдей нәрсені істейтін сияқты көрінуі мүмкін, бірақ олардың әрқайсысында сіз туралы білуіңіз керек болатын айырмашылық бар. Дисплей арасындағы айырмашылықты қарастырайық: жоқ және көрінетін: жасырын.

Көріну

CSS сипатын / көрінісін көру жұбын пайдалану: браузерден жасырылған элементті жасырады. алайда бұл жасырын элемент орналасуда әлі де орын алады. Бұл элементті негізінен көзге көрінбейтін етіп жасаған сияқты, бірақ ол әлі де орнында қалады және жалғыз қалдырылған еді.

Егер сіз бетіңізге DIV орналастырсаңыз және оны 100x100 пиксельге дейін мөлшерде беру үшін CSS-ні ​​қолдансаңыз, көріну: жасырын қасиет DIV экранда көрсетілмейді, бірақ кейінгі мәтін ол әлі де бар, сол сияқты 100x100 аралығы.

Шынымды айтсам, көріну қасиеті біз жиі пайдаланатын нәрсе емес, және, әрине, өз бетімізше емес. Егер біз басқа CSS қасиеттерін пайдаланатын болсақ, белгілі бір элемент үшін қалаған орналасуға қол жеткізу үшін орналасу сияқты пайдалансаңыз, онда бастапқыда бұл элементті жасыру үшін көріністі қолдануға болады, тек оны «айналдыру» үшін қайта қосу керек. Бұл осы қасиетті пайдаланудың бір жолы, бірақ қайтадан кез-келген жиілікте айналып өтетін нәрсе емес.

Дисплей

Элементті қалыпты құжат ағымында қалдыратын көрінетін қасиетіне қарағанда, дисплей: ешбір элемент құжаттан толығымен жоя алмайды. Ол HTML үшін әлі де бастапқы кодта болса да, ол ешқандай кеңістікке жол бермейді. Өйткені бұл, шынында, құжаттың ағынынан алынып тасталған. Барлық мақсаттар мен мақсаттар үшін, зат жойылды. Бұл сіздің ниеттеріңізге байланысты жақсы немесе жаман нәрсе болуы мүмкін. Бұл сипатты дұрыс пайдаланбаған жағдайда, ол сіздің бетіңізге де зиян келтіруі мүмкін!

Бетті тексерген кезде біз жиі «display: none» сөзін қолданамыз. Егер беттің басқа жерлерін тексеру үшін біраз уақытқа «кету» керек болса, онда біз дисплейді қолдана аламыз: ол үшін ештеңе жоқ. Алайда еске түсіретін нәрсе, бұл элементті осы сайтты нақты іске қосардың алдында бетке қайтару керек. Бұл әдіс HTML ағынында қалуы мүмкін болса да, бұл әдіс бойынша құжат ағынынан жойылған элемент іздеу жүйелерінде немесе экрандағы оқырмандарда көрінбейді. Бұрын бұл әдіс іздестіру рейтингісіне әсер ету үшін қара жолақ әдісі ретінде пайдаланылды, сондықтан көрсетілмейтін элементтер Google-тің мұндай көзқарастың неге пайдаланылуын қарастыру үшін қызыл жалау болуы мүмкін.

Дисплейді табудың бір жолы: бірде-бір пайдасы жоқ және оны тірі, өндіріс сайттарында қолданатын болсақ, біз біреудің өлшемі үшін қол жетімді элементтер бар болуы мүмкін, бірақ басқа адамдар үшін емес , жауапты сайтты жасаған кезде. Бұл элементті жасыру үшін дисплейді қолдана аласыз: ол кейінірек медиа сұрауларымен қайтадан қосады. Бұл дисплейді қолайлы пайдалану: жоқ, өйткені сіз ештеңені жасырмай себептермен жасыруға тырыспаңыз, бірақ мұны заңды түрде жасау керек.

Дженнифер Крининнің түпнұсқа мақаласы. Jeremy Girard 3/3/17 жылы редакцияланған