Jos yhtäläisyyksiä löytyy, olen otettu, ja jos se on uudelleenjulkaistu, ilmoita siitä
Kiertotie, jolla IE6, IE7, IE8, IE9, IE10, IE11, Bootstrap tukevat
Tein äskettäin verkkosivuston, olen aina kokenut, että bootstrap on todella hyvä. Tällä kertaa käytin bootstrap3:a, Chromea, Firefoxia, Safaria, Operaa, 360-selainta (nopeustila), Sogou-selain- ja muilla selaimilla ei ollut ongelmia, ja IE8:n ja IE11:n kohdalla ilmeni, että tyyliä ei voitu näyttää. Sitten useat Baidut. Lopulta netin postauksen avulla Yapeng.com ratkaisi ongelman. Katso myös Qianxun Learning Network Ratkaisu tiivistetään seuraavasti:
Ensinnäkin varmista, että HTML-sivusi alkaa DOCTYPE-ilmoituksella. DOCTYPE kertoo selaimelle, mitä HTML- tai XHTML-määrittelyä käyttää HTML-dokumentin jäsentämiseen, mikä vaikuttaa seuraaviin tekijöihin:
Rajoitukset tunnisteille, attribuuteille ja ominaisuuksille
Vaikuttaa selaimen renderöintitilaan, ja eri renderöintitilat vaikuttavat selaimen CSS-koodin ja jopa Javascrip{filter}t-skriptien jäsentämiseen.
DOCTYPE on ratkaisevan tärkeä, ja nykyinen paras käytäntö on kirjoittaa HTML-dokumentin ensimmäiselle riville:
<!DOCTYPE html>
On useita syitä löytää bootstrap, jotka tiivistetään jumalan kirjoituksessa, ensinnäkin Bootstrap3 kehitettiin mobiililaitteen ensisijaisuuden periaatteella, joten syyt voivat olla seuraavat:
1. Etäosoitetta ei kutsuta oikein
Eli niin kauan kuin se on IE9 tai alempi, kutsutaan kaksi erityistä js:ää
<!-- HTML5 Shim ja Respond.js IE8 tukevat HTML5-elementtejä ja mediakyselyitä -->
<!--[jos luutnantti IE 9]>
<scrip{filter}t src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></scrip{filter}t>
<scrip{filter}t src="http://apps.bdimg.com/libs/respond.js/1.4.2/respond.min.js"></scrip{filter}t>
<![endif]-->
Mutta testasin ja huomasin, että pelkkien yllä olevien js-tiedostojen käyttäminen ei ole mahdollista,
2. Kutsumenetelmä on virheellinen
Älä viittaa respond.min.js-, respond.js- tai CSS-tiedostoihin file://- tai @import-muodossa
3. Selaimen sisällön tunnistaminen (metatunnisteiden avulla selaimen renderöintitavan säätämiseen)
Bootstrap ei tue IE-yhteensopivuustilaa, ja jotta IE voi ajaa viimeisimmän renderöintitilan, sivulle lisätään seuraavat tunnisteet
IE=edge tarkoittaa, että uusin IE-ydin on pakotettu, ja chrome=1 tarkoittaa, että jos selaimen lisäosa Google Chrome Frame IE6/7/8:lle ja muille versioille asennetaan (mikä voi saada käyttäjän selaimen näyttämään edelleen IE:n valikolta ja käyttöliittymältä, mutta käyttäjä käyttää itse asiassa Chrome-selaimen ydintä selatessaan verkkoa), Chrome-ydintä käytetään renderöintiin. Tarkan selityksen tästä metatagista löytyy loistavasta vastauksesta StackOverflow'ssa, ja <meta>tunnisteasiantuntijan englanninkielinen selitys löytyy täältä
http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge-e
Lisäsin
<meta http-equiv="X-UA-Compatible" content="IE=9" />
Ja siinä se sitten
Ydin hallitsee metatagia, koska nykyiset Kiinan valtavirran selaimet ovat kaksoisytimiä, joten metatagi lisätään kertomaan selaimelle, mitä ytimen avulla sivun renderöinti
4. IE8 ei tue useita konttien ominaisuuksia
IE8 ei täysin tue laatikon kokoa: reunalaatikkoa käytetään min-leveys, maksimileveys, min-korkeus tai maksimikorkeus kanssa. Tästä syystä bootstrap v3.0.1:n konttiluokka ei enää käytä max-widthiä.
5.JS ongelma, joka johtuu CSS:n käyttöönoton järjestyksestä
Sinun täytyy lainata css ennen kuin viittaat js:ään
<link rel="stylesheet" type="text/css" href="bootstrap.min.css" media="screen"/>
<scrip{filter}t type="text/javascrip{filter}t" src="js/respond.min.js"></scrip{filter}t>
6. DOCTYPEssa on tyhjät rivit ennen ja jälkeen
<!DOCTYPE html>
Täällä ei ole ok olla välilyöntejä, ne täytyy poistaa
<html>
7. Voit myös muokata bootstrap.css manuaalisesti
Jos käytät bootstrap 2.1.1:ttä, navbar-inner{ filter:none} -tiedoston muokkaaminen voi ratkaista ongelman, jos käytät versiota 3.0+, koodia ei ole, katso yhteys lisätietoja varten
http://stackoverflow.com/questions/12460190/bootstrap-navbar-does-not-show-in-ie8
8. Käytä quirks-tilaa
Kun määritellään verkkosivua, vanhojen selainten kanssa taaksepäin yhteensopiva tila on quirks-tila, ja vastaava "standarditila" on standarditila. Tarkemmin sanottuna <!DOCTYPE html> kirjoitetaan kuten aiemmin
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Testasin tätä, mutta se ei ole mahdollista
Lopulta testasin IE11:llä, mutta IE8:lla ja löysin ongelman, jota ei tueta paikkamerkkinä
Näin ratkaistaan IE:n tuki paikkamerkkien suhteen
Tässä artikkelissa mainittu jquery testataan versiossa 1.11.1, ja jquery viitataan ensin
<scrip{filter}t type="text/javascrip{filter}t" src="http://code.jquery.com/jquery-1.11.1.min.js"></scrip{filter}t>
Voit myös käyttää muita jquery-versioita
Sitten esitellään <scrip{filter}t type="text/javascrip{filter}t" src="js/jquery.placeholder.js"></scrip{filter}t>
jquery.placeholder.js latausosoite tälle tiedostolle https://github.com/mathiasbynens/jquery-placeholder
Sitten lisää tiedostoon koodia
<scrip{filter}t type="text/javascrip{filter}t">
$(funktio () {
Käynnistä plugin
$('input, textarea').placeholder();
});
</scrip{filter}t>
Jos olen mukana täällä tai ongelma on edelleen ratkaisematta, siirrä http://hustlzp.com/post/2014/01/ie8-compatibility lisätietoja
Yllä mainitut IE6, 7, 8, 9, 10, 11, Chrome, Firefox, Safari, Opera, 360-selain (nopeustila), Sogou-selaimen testi läpäisti, vain IE5.5 ei vaikuta olevan toteuttamiskelpoinen, lyhyesti sanottuna ongelma ratkeaa tässä, kaikki paha IE6 – kutsutaan sitä soijakastikkeeksi
Jos et halua käyttää jquery.placeholder.js, et enää voi tukea paikkamerkkiemulaatioita selaimissa
Voit tutustua tähän artikkeliin saadaksesi hyvin yksityiskohtaisen http://ju.outofmemory.cn/entry/1595 |
Julkaistu 3.8.2016 22.55.23
|
|
|
Vuokraisäntä