/ / Käytä CSS-ominaisuutta "näyttö: ei mitään"

CSS-ominaisuuden käyttäminen "display: none"

Cascading Style Sheets (CSS) -toiminnon avulla voit järjestää verkkosivun ulkoasun ja tuntuman. Yksi yleisimmin käytetyistä ominaisuuksista ja sen arvoista on "näyttö: ei mitään".

Kiinteistön määritelmä

näytä mitään

Omaisuus itsessään on monikäyttöinen ja määritteleeasiakirjan elementin näyttötyyppi. Valitusta arvosta riippuen tietty sivun osa voidaan näyttää lohkoina, lineaarisesti, luettelokohteina, osana taulukkoa jne. "Näyttö" -ominaisuuden ansiosta voit siis muuttaa itse lohkon tyypin asiakirjassa.

Linkin "omaisuuden arvon näyttö:Ei mitään ", sen avulla voit poistaa elementin tai lohkon dokumentista. Samaan aikaan tämän sivun osan tilaa ei ole varattu, eli se putoaa virrasta. Kaikki elementit, jotka ovat" kauko-ohjaimen "takana, eivät yksinkertaisesti näe sitä ja sivuuttaa tällaisen Jos haluat palauttaa piilotetun objektin, sinun täytyy käyttää asiakirjaa skriptien kautta, jotka yksinkertaisesti muuttavat ominaisuuden arvoa haluttuun muotoon, ja sivu alustetaan automaattisesti uudella objektilla.

"Näyttö" - ja "näkyvyys" -ominaisuuksien välinen ero

tyylinäyttö ei ole

Huolimatta siitä, että lopulta molemmat ominaisuudet piiloutuvatelementin käyttäjältä, niiden toimintaperiaate on huomattavasti erilainen. Kuten edellä mainittiin, parametri "display: none" poistaa elementin kokonaan asiakirjasta. Lohko putoaa sivulta, joten se ei vie tilaa siinä. Tällöin objekti itse pysyy HTML-koodissa.

Puolestaan ​​"näkyvyys:hidden "piilottaa elementin käyttäjältä, mutta ei poista sitä asiakirjamallista. Tämä jättää sivulle varatun tilan tälle lohkolle. Toisin sanoen, dokumenttivirta havaitsee ja ottaa huomioon" visibility: hidden "-ominaisuuden sisältävän elementin sijainnin ja koon täsmälleen samalla tavalla kuin samoin kuin ilman sitä.

Tällainen ero asiakirjarakenteen organisaatiossa näiden kahden ominaisuuden mukaan antaa sinun saavuttaa tarvittava tulos sivun oikeaan näyttämiseen.

CSS: n käyttö - näyttö: ei mitään

div-näyttöä ei ole

Internet-asiakirjan avulla voit käyttääuseita vaihtoehtoja elementin ominaisuuksien määrittelemiseksi. Ensinnäkin, display: ketään ei voi kirjoittaa erilliseen CSS-tyylitiedostotiedostoon. Tämä menetelmä on edistynein ja oikea, koska sen avulla voit siirtää kaikki valitsimet, luokat ja niiden ominaisuudet erilliseen asiakirjaan. Tällainen malli mahdollistaa sivuparametrien löytämisen ja muuttamisen nopeasti.

Asiakirjan otsikossa

Toinen vaihtoehto on määritellä tyylittyylin tunnisteiden välissä olevan asiakirjan pää. Tämän menetelmän tehokkuus on paljon vähemmän. On suositeltavaa käyttää sitä vain viimeisenä keinona, koska suuren määrän tyylejä luotaessa verkkosivujen suunnittelijan heikkenee merkittävästi sivun luettavuus. Tämä johtaa virheisiin ja hidastaa Internet-asiakirjan kehittämisprosessia. Tätä lähestymistapaa suositellaan vain, kun tähän tyyppiin lisätään pieni määrä tyylejä tai asiakirjan virheenkorjaus.

On muistettava, että jos tämä menetelmäJos tyyliorganisaatio sijaitsee asiakirjassa, joka on pienempi kuin erillisen tyylisivun tuonti, html-asiakirjan rungossa olevat ominaisuudet korvaavat leikkaavat ominaisuudet.

Div-lohko. Näyttö: ei mitään

css ei näytä mitään

Toinen tapa on lisätäsuoraan "style = display: none;" -koodielementtitagiin. Tätä lähestymistapaa käytetään usein työskenneltäessä eri kehysten kanssa, joiden tarkoituksena on vähentää ominaisuuksien määrää suoraan tyylitaulukossa ja näyttää ne itse Internet-asiakirjassa. Lisäksi tämä merkintä tapahtuu usein, kun "kooditarkastaja" tarkastelee sivua. On tärkeää muistaa, että tätä lähestymistapaa käyttämällä voit muuttaa ominaisuutta ja sen arvoa tyylitaulukossa kirjoitetulla tavalla. Siksi sinun tulisi olla varovainen, sillä lopulta voit luoda itsellesi lisäongelmia ja viettää aikaa etsimällä ja korjaamalla sivukoodivirheen.

JavaScript

On myös syytä mainita ylimääräinenmahdollisuus muuttaa tätä ominaisuutta. Se ei enää viittaa tyylitaulukkoon ja html-koodiin, vaan komentosarjakieleen. Siksi, jotta voit käyttää sitä, sinulla on oltava ainakin jonkin verran tietoa tällä alalla. Voit poistaa elementin asiakirjavirrasta käyttämällä JavaScript-ominaisuutta "display = none". Sen avulla voit muuttaa asiakirjan rakennetta tietyn tapahtuman tapahtuessa. Komentosarjojen käytön ansiosta voit myös muuttaa dynaamisesti ("lennossa") ominaisuusparametriä ja päivittää siten sivunäkymän lataamatta sitä uudelleen. Tämä lähestymistapa on hyödyllinen järjestettäessä pudotusvalikkoja, modaaleja ja lomakkeita.

SEO

javascript-näyttö ei ole

Hakukoneiden verkkosisällön optimoinnin alallakoneessa, on olemassa monia taikauskoa ja epäselvyyksiä. Esimerkiksi monet hakevat hakukoneoptimoijat harkitsevat "display" -ominaisuuden käyttöä huonona tapana. He selittävät tämän sillä, että hakukoneet, piilotettua sisältöä nähdessään, alkavat pitää sivua roskapostina. Heidän sanoissaan on rakeinen logiikka, mutta ei muuta. Tässä vaiheessa objektin piilottamisen ominaisuutta käytetään melko usein avattavien valikoiden muotoiluun ja asiakirjan sellaisten osien piilottamiseen, jotka eivät tällä hetkellä kiinnosta käyttäjää (esimerkiksi kun yksi luokka valitaan, tiedot muista poistetaan). Tätä lähestymistapaa käyttävät melko tehokkaat Internet-portaalit (yksi niistä on "Amazon"). Hakukoneiden indeksoijat eivät siis voi harkita "display: none" -ominaisuuden käyttöä roskapostina.

Toinen asia, kun tätä lähestymistapaa käytetäänpiilottaa yksittäiset sanat ja symbolit. Huolimatta siitä, että nyt hakuroboteilla ei vielä ole täydellisiä algoritmeja tällaisen "roskapostin" tunnistamiseksi asiakirjoissa, todennäköisyys sivun tarttumisesta tälle on melko suuri. Siksi on suositeltavaa käyttää "näyttö" -ominaisuutta tiukasti sen käyttötarkoitukseen - vaihtaa lohkon tyyppi tai piilottaa se tilapäisesti käyttäjän silmiltä.

piti:
0
Suosituimmat viestit
Henkinen kehitys
ruoka
y