CSS教程之CSS挑选器撑持列表
目前我们的站就是div+css做的,美工可以通过css直接控制我的程序输出的页面动态数据的样式DIV就只是布局元素.网页制造poluoluo文章简介:evotech网站收拾的CSS选择器撑持列表.
Update6/30/09:Firefox3.5wasreleasedtoday.LikeSafari3.1andnewer(includingSafari4beta),Opera9.64andnewerandGoogleChromeallsupportALLCSS2.1andCSS3selectors.HereisabreakdownofallthebrowsersI’vetested:
[*]Green/√meanscurrentsupport.
[*]Orange/Δmeansthatthebrowsershavesomesupportfortheselector.
[*]Red/Χmeansthatthebrowserisnon-compliant.
BrowsersPatternMeaningIE6IE7IE8FireFoxSafariOperaNetScCHROMEE:active
E:hover
E:focus
Dynamicpseudo-classes
MatchesEduringcertainuseractions.
ΔΔ√√√√√√ΔΔ√√√√√√ΧΧ√√√√√√E:before
E:after
Staticpseudo-classes
SeegeneratedcontentΧΧ√√√√√√ΧΧ√√√√√√iPhnWindowsXPMacOSXSelectorSaf3.2Saf3.0googchrmFF3.5FF3.0
9.0
Saf
3.0
IE8IE7inIE8
Saf4betaSaf3.2FF3*√√√√√√√√√√√√√√√√√√√√√E√√√√√√√√√√√√√√√√√√√√√.class√√√√√√√√√√√√Δ√√√√√√√√#id√√√√√√√√√√√√√√√√√√√√√EF√√√√√√√√√√√√√√√√√√√√√E>F√√√√√√√√√√√√Χ√√√√√√√√E+F√√√√√√√√√√√√Χ√√√√√√√√E√√√√√√√√√ΔΔΔΧ√√√√√√√ΔE√Δ√√√ΔΔΔΔ√√√Χ√√√Δ√√ΔΔE√Δ√√√ΔΔ√Δ√ΔΔΧ√√√Δ√√ΔΔE√Δ√√√ΔΔ√Δ√ΔΔΧ√√√Δ√√ΔΔ:first-child√Δ√√√ΔΔΔΔ√ΔΔΧ√√√Δ√√Δ√:link√√√√√√√Χ√√√√√√√√√√√√√:visited√√√√√√√Χ√√√√√√√√√√√√√:lang()√√√√√√√Δ√√ΧΧΧ√√√Χ√√√√:before√√√√√√√√√√ΧΧΧ√√√√√√√Χ::before√√√√√√√√√ΧΧΧΧ√√√√√√√Χ:after√√√√√√√√√√ΧΧΧ√√√√√√√Χ::after√√√√√√√√√ΧΧΧΧ√√√√√√√Χ:first-letter√√√√√√√√√√√√√√√√√√√√Χ::first-letter√√√√√√√√√ΧΧΧ√√√√√√√√Χ:first-line√√√√√√√√√√√√√√√√√√√√Χ::first-line√√√√√√√√√ΧΧΧ√√√√√√√√ΧThefollowingselectorsarenewtoCSS3(abovewereinpreviousversions)E√Δ√√√ΔΔΧΔ√ΧΧΧ√√√Δ√√ΔΔE√Δ√√√ΔΔΧΔ√ΧΧΧ√√√Δ√√ΔΔE√Δ√√√ΔΔ√Δ√ΧΧΧ√√√Δ√√ΔΔE~F√√√√√√√√√√√√Χ√√√Χ√√√Χ:root√√√√√√√Χ√ΧΧΧΧ√√√√√√√√:last-child√Χ√√√ΔΔΧΧΧΧΧΧ√√√Χ√√ΔΔ:only-child√Χ√√√ΔΔΧΧΧΧΧΧ√√√Χ√√ΔΧ:nth-child()√Χ√√ΧΧΧΧΧΧΧΧΧ√√√Χ√ΧΧΧ:nth-last-child()√Χ√√ΧΧΧΧΧΧΧΧΧ√√√Χ√ΧΧΧ:first-of-type√Δ√√ΧΧΧΧΔΧΧΧΧ√√√Χ√ΧΧΧ:last-of-type√Χ√√ΧΧΧΧΧΧΧΧΧ√√√Χ√ΧΧΧ:only-of-type√Χ√√ΧΧΧΧΧΧΧΧΧ√√√Χ√ΧΧΧ:nth-of-type()√Χ√√ΧΧΧΧΧΧΧΧΧ√√√Χ√ΧΧΧ:nth-last-of-type()√Χ√√ΧΧΧΧΧΧΧΧΧ√√√Χ√ΧΧΧ:empty√Χ√√√ΔΔΧΧΧΧΧΧ√√√Χ√√ΔΔ:not()√√√√√√√Χ√ΧΧΧΧ√√√√√√√√:target√√√√√√√Χ√ΧΧΧΧ√√√√√√√√:enabled√√√√√√√√√ΧΧΧΧ√√√Χ√√√Χ:disabled√√√√√√√√√ΧΧΧΧ√√√Χ√√√Χ:checked√√√√√√√√√ΧΧΧΧ√√√Χ√√√√IE8CSSSelectorSupport
IE8SupportstheCSS2.1selectors,includingpseudoclassesbutnotpseudoelements.(SeeDoubleColonNotation).IE8hassupportforhassupportforAccessibleRichInternetApplications(ARIA)
ToforceIE8torenderyourpageinIE8compliancemode,includethefollowingmetatag:
<metahttp-equiv="X-UA-Compatible"content="IE=8"/>IE7withinIE8CSSSelectorSupport
TheCSSselectorsupportofIE7withinIE8(whenIE8displayesapageinIE7compatibilitymode)isidenticaltoIE7asastandalone.However,theCSSpropertiesdorenderdifferently.IwillhavetoblogaboutthatinaseperateentrywhenIgetaroundtogarneringallthedifferences.
IE7withinIE8understandstheIE7starhack.BecausetheCSSrendersdifferentlyeventhoughtheselectorsupportisthesame,itmaytakeabitbeforeIfigureoutthebestfilter.
iPhone
TheoriginalversionoftheiPhonecamewithaSafaribrowserthatdidnotsupportallCSS3selectors.ThecurrentlyactiveversionofSafariontheiPhonedoessupportallCSS3selectors.Thegridbelowhasbeenupdatedtoreflectthat.IhavekepttheoldversionoftheiPhoneCSS3supportjustincaseyouwanttosupport"unlocked"versionoftheiPhone,thatdonotgetupdatedasoften.Personally,IassumealliphoneshittingmyappssupportallCSS3.FormoreinformationoniPhones,seeiPhoneCSSSupport
Safari4BetaCSSSelectorSupport
Safari4.0BetawasreleasedFeb.24,2008.SinceSafari3.2supportedallCSSselectors,thisSafari4partofthepostmaybeabitmute.Safari4betaalsosupportsARIAandforCSSeffects,animationandcanvas.Italsoseemstohavemanymorenativedebuggingtoolsnativetotheapplication(ormaybewhatIseeisacarryoverfromthetoolsIinstalledinmypreviousversionofSafari).Safari4isAcid3compliant!
IE8Notes:
[*]EDoesnotmatchtheattributewhentheattributevalueisemptyornotwrittencorrectly.
IE7withinIE8Notes:
[*]ESameasIE8,doesnotmatchtheattributewhentheattributevalueisemptyornotwrittencorrectly.
[*]EOnlyissueisthatforthisselectortowork,thevalueoftheattributeiscasesensitive
[*]EIE7hassomecasesensitivityissues,butgenerallyworks.
[*]:first-childIE7considersacommentoratextnodeasafirst-child,whenitshouldn’t:onlyelementsshouldbeconsideredchildren.So,IE7matchesthefirstcommentinsteadofthefirstchild.Ifitseestextoracommentasthefirstchild,itwillnotconsiderthefirstelementasthefirstchild.
Div全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。 在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。 运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环 只要我们努力,无论是怎样的艰难险阻,成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。 足见市场的反响和MACROMEDIA公司对它们的自信。说到Dreamweaver8我们应该了解一下网页编辑器的发展过程,随着互联网(Internet) 的家喻户晓。 难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心,坚持不懈的决心。在自己无法解决某些问题时,就需要虚心请教别人. Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器,在编辑时能同时看到源码和设计界面,非常方便新手学习制作网页。 HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器) 不管老师做怎样的解释,而我却对它感到很是吃力,诸如里面有许多不知道的功能。
页:
[1]