În ciuda naturii exotice a acestui filtru, am avut nevoie deja de două proiecte. Acest lucru, desigur, pentru că am un mac și nu-mi pasă. Scurt murdar (dovada invalidă și nu viitoare), dar lucrează aici și acum hack pentru Safari 2-3.
Ce este necesar?
Situația, în care aveam nevoie de el, sa dovedit a fi 2.
2. Pe acest blog, am folosit fontul Myriad pentru textul (toate). Foarte frumos și ușor de citit font. În Windows, cu toate acestea, are un anti-aliasing complet inadecvat și de necitit, ghici ce ecran de la Windows:
De asemenea, filtrul mi-a permis cel puțin pentru utilizatorii Safari (și acesta este designerul și designerul blogului meu =)) pentru a da site-ului în forma sa originală cu Myriad. Restul arată o frumoasă Arial.
Un filtru este o combinație de două filtre (Safari 2 și 3).
Se știe că Safari 2 este foarte sensibil la caracterele invalide străine în CSS, atât de mult încât să nu citească codul după ei. De exemplu, iată un design:
Toate browserele vor face paragraful verde. În timp ce în Safari 2 va rămâne roșu. De fapt, în loc de # poți să folosești o grămadă de personaje ciudate, dar ce diferență are dacă lucrează. Desigur, dacă scrieți aceste trei linii la începutul CSS, Safari 2 nu îl citește (fișierul) deloc. În plus, nimeni nu împiedică utilizarea în loc de selectori, de exemplu importul și dând un întreg fișier CSS separat pentru Safari 2.
C Safari 3 este mai ușor. A apărut recent și, ca orice browser nou, suportă întunericul întunecat al pseudo-claselor CSS3 interesante, pe care browserele Windows nu s-au gândit încă și într-adevăr toate celelalte. Este foarte probabil ca acestea să fie sprijinite doar în următorii câțiva ani. Una dintre aceste proprietăți:
Fontul va fi roșu numai în Safari 3. Pseudo-clasa, pe calea însăși exotică - o aplicație teoretică inteligibilă, nu m-am gândit niciodată. Destinația oficială:
Pseudo-clasa de primă clasă reprezintă un element care este primul frate al tipului său în lista de copii a elementului său parental
Combinație pentru Safari 2 și 3
Combinând aceste două filtre, puteți alimenta stilurile numai pentru Safari 2-3.
Iată cum fac acest lucru pe blogul meu pentru a admira Myriad:
Funcționează! În ciuda unui procent mic de Safari în general, există o tendință la faptul că printre clienții moderni este foarte comună. În general, Safari este foarte bun și aceste filtre sunt extrem de rare.
Aș fi fericit dacă cineva împărtășește experiența lor!
Actualizare v.2
Selecția finală a filtrelor (datorită Antejan și Mester):
- / * va înțelege numai safari * /
- corp: primul .class<>
- / * va înțelege numai safari * /
- html: root * .class <>
- / * va înțelege numai safari * /
- html * .class <>
- / * va înțelege numai safari și operă * /
- Ecranul @media și (-webkit-min-device-pixel-ratio: 0)<.class <>>
- / * va înțelege numai safari * /
- corp: primul .class<>
În momentul tuturor acestor hack-uri, numai una funcționează:
cel mai de succes mod în opinia mea este de a scrie css pentru Safari 3 / Chrome numai:
Ecranul @media și (-webkit-min-device-pixel-ratio: 0) corp: primul de tip .clazz
>
În primul rând. Fontul din intuiții și din texareac ar trebui corectat, cel vechi rămân.
În al doilea rând, și cele principale. Sunt uimit de regizorii artistici care nu se deranjeaza cu proiectele rezonante si cu alte sticle pentru a afla o lista de zeci de fonturi.
Ceea ce se adaugă utilizatorilor de cramă și a site-ului web. Ce naiba ar putea fi nenumărate, Genn. Acesta nu este un flash, și nu un photoshop, și nici măcar safari-ul tău cu netezirea aspră. e timpul sa intelegem deja ceea ce, dracu '!
Și da, eu susțin că puteți face nenorocite site-uri folosind fonturi care funcționează normal pe toate platformele, fără aceste perversiuni.
Mulțumesc, chiar am trecut cu vederea intrarea =). Genn însuși ar putea să răspundă, dar este de fapt mult mai „lucru mic frumos“ pentru mine și utilizatorii Safari, mai degrabă decât „site-ul pe o multitudine de“ Sunt mereu pe miriadele înlocuiește Tahomu sau Arial, și nici măcar nu cred în proiectele lor mai mari. Până când i-am văzut pe Miriad sub Safari ...
Acesta este blogul meu personal - unde altundeva pot fi pervertit? =)
PS: despre anti-aliasing în Safari la tine în zadar =)
Netezirea subpixelului este un lucru atât de controversat. Să-l lăsăm :)
În notația despre comentarii, se pierde codarea întregului text al serviciului, se pare că codarea însăși este incorectă pentru șablonul în sine.
Ei bine, ar fi frumos să faci o ancoră pentru komentov și să dai un link la ea în scrisoare :)
Da, incercarile mele de a face UTF-8 pretutindeni nu au fost de succes pana acum) Acest lucru este partial de ce inca mai am WordPress 1.5, doar shhh ....
În safari sub Windows, am un Arial foarte netezit. Intrigile pe aspectul Wawbe așa cum a fost conceput. dar, depuneri nelistate - ca întotdeauna cazuri de săpun ..
@ David: bebebe și Wah) este că am folosit pentru a confunda prea departe cu glume, bătaie de joc, în general, =) diferențele I părea atât de evident - că nici Bebe și wow nu poți confunda. În ceea ce am avut dreptate!
@Oto: Hack este natural doar pentru Mac OS, pentru safari sub Windo ar fi neteda acelasi dezgustator "Myriad". Și în general - dacă cineva nu este serios despre Safari sub Windows? E așa ... o jucărie.
@ Serghei: Nu înțeleg ce fel de cartografiere incorectă vorbești? Doar în browserele mele totul este ok acum, aș fi foarte recunoscător pentru ajutorul pentru a arăta bug-ul. (sau esti ipotetic?)
/ * + numai safari * /
html * .class <>
/ * - numai safari * /
/ * + numai safari3 * /
Ecranul @media și (-webkit-min-device-pixel-ratio: 0) .class <>
>
/ * - numai safari3 * /
Pentru prima vă mulțumesc! adăugați la postare
Dar al doilea deja înțelege și operează 9 ... Este necesar să ne amintim acest lucru. El nu este "doar safari3"
Apropo, corpul: primul-de-înțelege și Opera 9.5
Dar @media ecran și (--webkit min-dispozitiv-pixel-raport: 0) Opera mea nu este realizat, spre deosebire, de exemplu, @media ecran și (min-lățime: 20px)
Din câte știu, a fost înțeleasă ca cea de-a 9-a operă, adică nu va mai exista niciun sprijin în viitor, este un serviciu special - web ***
Ambele adăugate la post, va fi o privire completă asupra problemei.
Vă mulțumesc foarte mult Antejan și Kildor!
Și cu ultima actualizare mac, a fost livrat de mașina automată safari 3. Poate că este timpul să înscrieți pe a doua. Într-o lună sau șase luni, cota sa va fi neglijabilă.
Sunt de acord =) Dar, prin natura ei, mulți makjuzery doresc să-l cumpere și, prin urmare, tranziția este întârziată. Și, în general, nu m-am bucurat încă de un tigru suficient), deoarece stau pe 2 Safari și pe Mac OS Tiger. Și, în general, safari este atât de bun încât hack-ul este mai degrabă o "glumă" decât o nevoie reală
Oh, iar bara mea de instrumente Google din Firefox răstoarnă chiar și această rotunjire frumoasă maronie.
Da, poate ideea de personalizare a intuițiilor este utopică:
Mă refer la ultima actualizare a Tigrului :) A livrat cu succes Safari 3.
Și poți să-mi spui cum să vezi site-ul în safari pe Windows?
Ei bine, ce tip de serviciu este un fir sau un program ...
Macii nu sunt prea obișnuiți pentru noi - voi începe să-mi optimizez site-urile numai atunci când nu am nimic de făcut :)
Sigur că ați vrut să faceți totul plăcut, dar merită atât de mult efort?
Așa cum este uneori stresant să fii un designer web ... a fost dezvoltat un singur standard, dar toată lumea crede că are dreptul să-l rupă în felul propriu, dar suntem puși în umbră :)
În general, aveți dreptate desigur =)
Dar ... în acest judecător special pentru tine - am un mac, proiectantul mac, împreună vom face un site ... =) Și totuși, mulți clienți bogați au maci - și văd cu siguranță aspectul în primul rând în cadrul acestui sistem de operare, așa că am decis că nu este întotdeauna , dar uneori asemenea hack-uri vin la îndemână
Html * .class <> Safari3win pleacă fără atenție ...
Deja joi voi fi pe macul meu - o să văd. Acum, încredere, dar verificați. Deși încă mă înclin spre o atitudine non-serioasă față de versiunea Windows ...
html * .class <> - Safari + IE
html: root * .class <> - doar Safari
html * .class <> - nevalidno
primul-de-tip - această pseudo-clasă (ca oricare altul ar trebui să-și asume) este înlocuit de: hover atunci când mouse-ul. și lacrimi ... ca un tuzik
Și ce, pseudo-clasele nu pot fi aplicate simultan? Sunteți ceva confuz. Amintiți-vă: hover și: first-child, de exemplu.
Sau v-am înțeles greșit?
Adică, ce se întâmplă dacă descrie proprietățile pentru: primul copil și: hover, și ei [proprietățile], în mod natural, sunt diferite, atunci când treceți mouse-ul de tuning safari (ceea ce este descris în: primul-copil) a pierdut, și intră în vigoare ceea ce este descris pentru pseudo-clasa: hover
Nu se intenționează utilizarea:
Aproape nimeni nu întreabă: hover pentru corp ...
Aaaa, atunci este clar, dar nu am reușit. Clasa: prima de tip, pentru că a intersectat cu.
Să definim mai detaliat sintaxa html * .class <> și html: root * .class <>. Nu înțeleg nici una dintre aceste construcții în niciuna dintre interpretări ... În ce loc al acestor directive miracole vom introduce un selector real cu proprietăți? )
Crearea unei pagini cu toate filtrele. în Safari 3 toate blocurile sunt verzi. Aceasta înseamnă că Safari 3 percepe întregul CCM. În firefox - toate roșu. În opera blocul verde este numerotat 4.
Partajați o captură de ecran sau o observație? Aveți Safari 2?
Yuri, mulțumesc. Mi-am găsit greșeala în sintaxa. Construcții html * .class <> și html: root * .class <> într-adevăr funcționează.)
mai mult html: root .class <> - funcționează în Safari + Firefox
Mulțumesc pentru selecție =) Cât de bine este faptul că toate kaki-urile dintr-un singur loc nu sunt încă necesare aproape niciodată, ar fi foarte înfricoșător să ne amintim astfel de construcții)
Și dacă am nevoie de o hacking Safari pentru clase moștenite, cum ar fi
h3.green.listing
Este doar prima opțiune "murdară"?
Când liderii deja conspiră într-un fel în cele din urmă și nu va fi necesar ca fiecare browser să poloneze ceva și să-l modifice cu un fișier. Nu a fi un specialist în html / css uneori durează mult timp, astfel încât site-ul nu perekosobachivalo și totul arăta la fel peste tot.
Și acum situația sa schimbat puțin.
În primul rând, -webkit-min-device-pixel-ratio: 0 înțelege Opera 9 la 9.5, iar în al doilea rând, de la 9.5 înțelege: primul de tip. În al treilea rând, pe lângă Safari 3, toate acestea sunt înțelese de Chrome.
Prin urmare, cel mai de succes mod în opinia mea este să scriu css pentru Safari 3 / Chrome numai:
Ecranul @media și (-webkit-min-device-pixel-ratio: 0) corp: primul de tip .clazz
>
Opera 9 va trece prin @media, dar se va rupe în: primul-de-tip și 9.5 imediat pe @media.
Și aici sunt capturile de ecran în sprijinul cuvintelor lor.
Remedieri minore:
Ecranul @media și (-webkit-min-device-pixel-ratio: 0) corpul: primul .n5 fundal: verde;
>
>
.N5
Apropo, poate orice utilizator / admirator al Operei să explice cât de proprietate (dacă nu mă înșel) prowebkit-proprietate în acest browser?
html * nu înțelege cu încredere
corp: primul selector de tip - Mozilla și opera, de asemenea, în subiect :)
corp: primul de tip - crom
Deci, există doar html: root *
[...] De asemenea, nu funcționează în Chrome 2. Motivul pentru utilizarea acestui hack și alte hacks pentru safari poate fi găsit aici. [...]
Și există câteva considerații, cum să scrieți un hack pentru al treilea safari, care nu va funcționa în cel de-al patrulea safari?
[...] De asemenea, nu funcționează în Chrome 2. Motivul pentru utilizarea acestui hack și alte hacks pentru safari poate fi găsit aici. [...]
Ei bine, de asemenea, pentru versiunea de tip 5 nu există hacks: (?
Ultimele 5
Trimiteți-le prietenilor: