Come convalidare prefissi vendor in CSS come -webkit- e -moz-?
https://stackoverflow.com/questions/1889724
-
19-09-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianDomanda
Io uso le proprietà CSS WebKit / mozilla raggio di confine e scatola di ombra, ma voglio che il CSS per convalidare (che attualmente non lo fa). C'è un modo per farlo convalidare?
Soluzione
No, sono proprietà specifiche del browser, e non definite nella specifica CSS standard.
Detto questo, seguono correttamente le regole per il fornitore un'estensione specifica dei CSS. Non è solo nelle specifiche CSS ufficiale del W3C.
Altri suggerimenti
Sebbene la sintassi per estensioni del fornitore è menzionato nel modulo CSS3 Sintassi e introdotto nella grammatica per consentire ai fornitori di implementare i propri prefissi ignorando lo standard, le estensioni attuali vendor stessi non sono riconosciuti come proprietà ufficiali CSS. Questo non sta per cambiare, in quanto sono proprietarie e specifico ai venditori che inventano e li usano.
Tuttavia, un miglioramento di recente ( primi mesi del 2011 ) al Jigsaw W3C CSS Validator permette di ridurre di validazione errori innescato da estensioni del fornitore a avvertenze . Trova questa nuova opzione tra l'altro, come il livello di CSS per convalidare contro espandendo la Altre opzioni :
In questo modo è più facile trovare i veri problemi con il foglio di stile se ancora non convalida. Se le estensioni del fornitore sono le uniche cose innescando errori, trasformandoli in avvertimenti permetterà il vostro foglio di stile per convalidare provvisoriamente. Esso elimina inoltre la necessità di mantenere le estensioni vendor in un foglio di stile separato che si deve nascondere dal validatore.
Gli avvertimenti sono il più lontano si può rifuggire da errori, anche se, come in ultima analisi, i prefissi vendor sono ancora non standard e quindi tecnicamente non valida CSS.
E 'possibile in parte. Raccogliere tutte le classi CSS non supportati in un unico file (css3.css)
Esempio:
css3.css
.round{
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 5px;
border-bottom-left-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
border-top-left-radius: 5px 5px;
border-top-right-radius: 5px 5px;
-webkit-border-bottom-left-radius: 5px 5px;
-webkit-border-bottom-right-radius: 5px 5px;
-webkit-border-top-left-radius: 5px 5px;
-webkit-border-top-right-radius: 5px 5px;
}
default.css
.square{
width: 100px;
height: 100px;
border: 1px solid #000000;
}
page.html
<html>
<head>
<link rel="stylesheet" type="text/css" href="default.css">
<script type="text/javascript">
document.write('<link rel="stylesheet" type="text/css" href="css3.css">');
</script>
</head>
<body>
<div class="square round"></div>
</body>
</html>
Motore di ricerca non correre script client, in modo che le W3C attributi non supportati non danneggerà il vostro SEO. Per quanto riguarda la validazione css verde, mi dispiace, non ancora.
No, in quanto non sono parte dello standard del validatore convalida contro. L'unica soluzione che viene in mente è quello di mettere le proprietà incompatibili in un foglio di stile separato.
Le proprietà specifiche di Mozilla e WebKit non convalida. Che cosa si può fare è separata tua css "arricchito" in un foglio di stile separato. Proprio come a separare gli stili cioè di hack del vostro foglio di stile principale. In questo modo i fogli di stile di base saranno convalidare.
Se si utilizza un file CSS separato per il mio "non valido" o "specifico del browser" CSS quindi utilizzare un po 'di PHP per filtrare che i CSS dal validatore:
<?php
if(preg_match("/jigsaw.w3c.org/i", $_SERVER['HTTP_HOST'])){
echo '<link rel="stylesheet" href="invalid.css" type="text/css" media="screen, projection" />';
}
?>
Poi collegare il validatore con CSS3 come profilo (accetta border-radius, text-shadow, ecc.):
http://jigsaw.w3.org/css-validator/check/referer?profile=css3
$ _ SERVER [ 'HTTP_HOST'] non funziona, ma forse c'è qualcosa che lo farà?
12-12-2011
Kami davvero postato la soluzione migliore. Creo un file separato e css3.js document.write ( ''); la linea di CSS per riga:
CSS3.js
document.write('\
<style type="text/css">\
home_low_mod {zoom: 1;}\
#home_module {-moz-border-radius: 8px;-webkit-border-radius: 8px;-moz-box-shadow: 0px 1px 3px #a5a6a2;-webkit-box-shadow: 0px 1px 3px #a5a6a2;behavior: url(PIE.htc);}\
#page {-moz-border-radius: 8px 8px 0 0;-webkit-border-radius: 8px 8px 0 0;behavior: url(PIE.htc);}\
</style>');
@BoltClock è COMPLETAMENTE a destra su questo ... W3C ha infatti aggiunto un livello vextwarning criteri BOOL. E ' non documentato ... ma se si utilizza il SOAP convalida API è possibile aggiungere un parametro al carico utile di richiesta di convalida GET ....
&vextwarning=true
per esempio ... se si voleva modificare il comando CSS validator in TextMate ... si farebbe "Modifica Bundles ...", alias ^ + ⌥ + ⌘ + B
#!/usr/bin/env ruby
print '<html><head><meta http-equiv="Refresh" content="0; URL='
print 'http://jigsaw.w3.org/css-validator/validator?\
warning=0&profile=none&usermedium=all&text='
scope = STDIN.read
…
a - qualcosa - più lungo del calibro di
#!/usr/bin/env ruby
print '<html><head><meta http-equiv="Refresh" content="0; URL='
print 'http://jigsaw.w3.org/css-validator/validator?\
warning=2&vextwarning=true&profile=css3&usermedium=all&text='
scope = STDIN.read
…
Si noti che ho anche aggiunto un level=css3 e cambiato il warninglevel. Alterare questi, secondo l'API, come necessario .
Se volete vedere tutti i parametri che sono disponibili tramite il "online" presentare meccanismo .... aprono Firebug, o l'ispettore Webkit, etc. ., mentre la presentazione di una query tramite loro forma e controllare la full request content per ottenere ancora più opzioni , in base alle esigenze ...
