{"id":555,"date":"2009-07-31T13:24:00","date_gmt":"2009-07-31T05:24:00","guid":{"rendered":""},"modified":"2013-11-27T20:29:10","modified_gmt":"2013-11-27T12:29:10","slug":"ie-6%e3%80%817%e3%80%818%e4%b8%8eff-chrome-css-hack","status":"publish","type":"post","link":"https:\/\/kyle.ai\/blog\/555.html","title":{"rendered":"IE 6\u30017\u30018\u4e0eFF Chrome CSS HACK"},"content":{"rendered":"

CSS hack\u5199\u6cd5<\/p>\n

\u4e66\u5199\u987a\u5e8f\u4e3aFireFox\u5728\u6700\u524d\uff0c\u5176\u6b21\u662fIE8\u3001IE7\uff0c\u6700\u540e\u662fIE6\u3002<\/p>\n

color:red;\/\/\u6240\u6709\u6d4f\u89c8\u5668<\/p>\n

color:blue\\9;\/\/\u6240\u6709IE<\/p>\n

+color:orange;\/\/IE7<\/p>\n

_color:green;\/\/IE6<\/p>\n

color:green\\0; \u00a0\/\/IE8<\/p>\n

\u82e5\u6d4f\u89c8\u5668\u4e3aFireFox\uff0c\u90a3\u4e48color:red\uff1b\u82e5\u6d4f\u89c8\u5668\u4e3aIE8\uff0c\u6839\u636eCSS\u4f18\u5148\u6027\u539f\u5219\uff0ccolor:blue\uff1b\u82e5\u4e3aIE7\uff0ccolor:orange\uff1b\u82e5\u4e3aIE6\uff0c\u5219color:green\u3002<\/p>\n

IE6\u8bc6\u522b * \u3001_<\/p>\n

IE7\u8bc6\u522b * \u3001+<\/p>\n

IE8\u8bc6\u522b * \u3001\/9<\/p>\n

FF\u4ec0\u4e48\u90fd\u4e0d\u8bc6\u522b<\/p>\n

\"\"<\/p>\n

Chrome CSS Hack<\/p>\n

<style type=”text\/css”>
\n<!–
\n@media screen and (-webkit-min-device-pixel-ratio:0)
\n{
\nbody {
\nbackground-color: red; background-color:#33FF00\\9;
\n}
\n}
\n–>
\n<\/style><\/p>\n

1.\u5b9e\u73b0\u6700\u5c0f\u5bbd\u5ea6min-width<\/p>\n

\u6807\u51c6\u6d4f\u89c8\u5668\u548cie7+\u7528:min-width:1008px;<\/p>\n

\u8fd9\u6837\u5728\u5b9e\u73b0\u81ea\u9002\u5e94\u5e03\u5c40\u65f6\u53ef\u4ee5\u4fdd\u8bc1\u5e03\u5c40\u4e0d\u5c0f\u4e8e\u4e00\u5b9a\u5bbd\u5ea6\uff0c\u540c\u65f6\u5bbd\u5c4f\u6216\u7a84\u5c4f\u7a97\u53e3\u88ab\u7528\u6237\u62d6\u7a84\u540e\u4e0d\u4f1a\u51fa\u73b0\u5e03\u5c40\u81ea\u52a8\u6362\u884c\u3002<\/p>\n

\u5bf9\u4e8eIe6\u4ee5\u4e0b\u6a21\u62df\u5b9e\u73b0\u7528\u7684css\u8868\u8fbe\u5f0f:<\/p>\n

_width:expression((documentElement.clientWidth < 1008) ? “1008px” : “auto” );<\/p>\n

2.\u6700\u5927\u5bbd\u5ea6max-width<\/p>\n

\u6807\u51c6\u6d4f\u89c8\u5668\u548cie7+\u7528:max-width:600px;<\/p>\n

\u5b9e\u9645\u4e2d\u53ef\u4ee5\u5bf9\u5e03\u5c40\u5143\u7d20\u5982divOut{width:100%;max-width:1008px;margin:0 auto;}\u8fd9\u6837\u5728\u5bbd\u5c4f\u91cc\u8ba9\u4ed6\u4e0d\u5927\u4e8e1008px\u5bbd\uff0c\u4f46\u8fd9\u91cc\u6211\u4eec\u5141\u8bb8\u7a97\u53e3\u5c3a\u5bf8\u53d8\u5c0f\u65f6\u53ef\u4ee5\u81ea\u9002\u5e94\u3002<\/p>\n

\u8fd8\u6709\u6bd4\u5982\u6587\u7ae0\u9875\u4e2d\uff0c\u5bf9\u56fe\u7247\u663e\u793aimg{max-width:600px;}\u6211\u4eec\u4fdd\u8bc1\u56fe\u7247\u4e0d\u8981\u5927\u4e8e\u6211\u4eec\u7684\u6587\u7ae0\u5185\u5bb9\u5bb9\u5668\u5bbd\u5ea6100px\u5bbd\uff0c\u4ee5\u514d\u56fe\u7247\u663e\u793a\u4e0d\u5b8c\u6574\u3002<\/p>\n

\u5bf9\u4e8eIe6\u4ee5\u4e0b\u6a21\u62df\u5b9e\u73b0\u7528\u7684css\u8868\u8fbe\u5f0f:<\/p>\n

_width:expression((documentElement.clientWidth >600) ? “600px” : “auto” );<\/p>\n

IE6\u4e0b\u5b50\u5143\u7d20float\u65f6\u7236\u5143\u7d20\u9ad8\u5ea6\u7684\u95ee\u9898\uff1ahttp:\/\/bbs.blueidea.com\/thread-3010051-1-1.html<\/a><\/p>\n

.clearfix:after { content:”.”; display:block; height:0; clear:both; visibility:hidden; }<\/p>\n

.clearfix { zoom:1; }<\/p>\n

ie6 developer toolbar<\/p>\n

ie6 \u4e2d\u7684overflow:scrol\u65f6\uff0c\u7236\u5143\u7d20\u8981\u8bbe\u7f6e \u6210 position:relative\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"

CSS hack\u5199\u6cd5 \u4e66\u5199\u987a\u5e8f\u4e3aFireFox\u5728\u6700\u524d\uff0c\u5176\u6b21\u662fIE8\u3001IE7\uff0c\u6700\u540e\u662fIE6\u3002 color:red […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[],"class_list":["post-555","post","type-post","status-publish","format-standard","hentry","category-code_related"],"_links":{"self":[{"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/posts\/555","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/comments?post=555"}],"version-history":[{"count":1,"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/posts\/555\/revisions"}],"predecessor-version":[{"id":5273,"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/posts\/555\/revisions\/5273"}],"wp:attachment":[{"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/media?parent=555"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/categories?post=555"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kyle.ai\/blog\/wp-json\/wp\/v2\/tags?post=555"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}