<?xml version="1.0" encoding="utf-8" ?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>MEMO</title>
<link>https://ameblo.jp/einsx/</link>
<atom:link href="https://rssblog.ameba.jp/einsx/rss20.xml" rel="self" type="application/rss+xml" />
<atom:link rel="hub" href="http://pubsubhubbub.appspot.com" />
<description>すぐ忘れるので</description>
<language>ja</language>
<item>
<title>CSSハック一覧</title>
<description>
<![CDATA[ <h2>IE6以下用</h2><h3>スターハック</h3><pre>* html #hack { color:#000000; } </pre><p>対応ブラウザ：IE4～6、MacIE4～5</p><p>セレクタの前に【* html 】をつける。</p><h3>アンダースコアハック</h3><pre>#hack { _color:#000000; } </pre><p>対応ブラウザ：IE4～6</p><p>プロパティの前に【_】アンダースコアをつける。</p><p class="page_top"><a href="http://d-lover.com/css/hack.shtml#top"><br></a></p><a name="s02" id="s02"></a><h2>IE7用</h2><pre>*:first-child+html #hack { color:#000000; }</pre><p>対応ブラウザ：IE7</p><p>セレクタの前に【*:first-child+html】をつける。</p><p class="page_top"><a href="http://d-lover.com/css/hack.shtml#top"><br></a></p><a name="s03" id="s03"></a><h2>IE6、IE7用</h2><pre>#hack { /color:#000000; }</pre><p>対応ブラウザ：IE6、IE7</p><p>プロパティの前に【/】をつける。</p><p class="page_top"><a href="http://d-lover.com/css/hack.shtml#top"><br></a></p><a name="s04" id="s04"></a><h2>IE6のみ除外</h2><pre>#hack { color /**/:#000000; }</pre><p>対応ブラウザ：IE7、IE8、Firefox、Safari、Opera、Chrome</p><p>プロパティの後ろに【/**/】をつける。</p><p class="page_top"><a href="http://d-lover.com/css/hack.shtml#top"><br></a></p><a name="s05" id="s05"></a><h2>Firefox用</h2><pre>#hack { color:#000000; }<br>#hack, x:-moz-any-link { color:#333333; /* Fx 1.0 以降に適用される */}<br>#hack, x:-moz-read-only { color:#666666; /* Fx 1.5, 2.0 以降に適用される */}<br>#hack, x:-moz-broken { color:#999999; /* Fx 3.0 以降に適用される */}<br>#hack, x:x{ color:#000000; }<br></pre><p>対応ブラウザ：Firefox</p><p>「グループ化されたセレクタの中に、対応していないものがあるとすべてが無効化される」という性質を利用したハックです。一番最後の指定（x:x）では、一部ブラウザが未対応セレクタが含まれているグループを無視しないことがあるため、一番最初のデフォルト指定と同じ指定をします。</p><p class="txBold"><br><a href="http://www.yomotsu.net/lab/css/csshack_firefox" target="_blank">&nbsp;</a></p><p class="page_top"><a href="http://d-lover.com/css/hack.shtml#top"><br></a></p><a name="s06" id="s06"></a><h2>IE7以外のモダンブラウザ用</h2><pre>html&gt;/**/body #hack { color:#000000; }</pre><p>対応ブラウザ：Firefox、Safari、Opera、Chrome、IE8</p><p>セレクタの前に【html&gt;/**/body】をつける。</p><pre>html[xmlns] #hack { color:#000000; }</pre><p>対応ブラウザ：Firefox、Safari、Opera、Chrome、IE8</p><p>セレクタの前に【html[xmlns]】をつける。</p><p class="page_top"><a href="http://d-lover.com/css/hack.shtml#top"><br></a></p><a name="s07" id="s07"></a><h2>Safari3用</h2><pre>body:first-of-type #hack { color:#000000; }</pre><p>対応ブラウザ：Safari3</p><p>セレクタの前に【body:first-of-type】をつける。</p><p class="page_top"><a href="http://d-lover.com/css/hack.shtml#top"><br></a></p><a name="s08" id="s08"></a><h2>Safari2用</h2><pre>/* hogehoge \*/<br>html:\66irst-child #hack { color:#000000; }</pre><p>対応ブラウザ：Safari2</p><p>【/* hogehoge \*/】でコメントアウトをした後、セレクタの前に【html:\66irst-child】をつける。</p><p class="page_top"><a href="http://d-lover.com/css/hack.shtml#top"><br></a></p><a name="s09" id="s09"></a><h2>XHTML側の指定（条件分岐コメント）</h2><pre>&lt;!--[if It IE 7]&gt;<br>&lt;link rel="stylesheet" type="text/css" href="css/test.css" media="screen" /&gt;<br>&lt;![endif]--&gt;</pre><p>IEの特定のバージョンにのみ、そのCSSを適用させることができる。<br>↑は、「IE7未満（IE5～6）にだけ外部CSSを読み込ませる」という指定。</p><p class="page_top"><a href="http://d-lover.com/css/hack.shtml#top"><br></a></p><a name="s10" id="s10"></a><h2>clearfix</h2><pre>.clearfix:after{<br>content:".";<br>display:block;<br>height:0;<br>clear:both;<br>visibility:hidden;<br>} /*IE7以外のモダンブラウザ向け*/<br><br>.clearfix{display:inline-block;} /*IE7およびMacIE5向け*/<br><br>/*Hides from IE-mac\*/<br>* html .clearfix{height:1%;}<br>.clearfix{display:block;}<br>/*End hide from IE-mac*/ /*IE6以前向け*/</pre>
]]>
</description>
<link>https://ameblo.jp/einsx/entry-10474089973.html</link>
<pubDate>Fri, 05 Mar 2010 13:16:53 +0900</pubDate>
</item>
<item>
<title>横並びのdl</title>
<description>
<![CDATA[ <div class="cssElementRuleContainer "><div class="cssRule insertInto cssEditableRule " role="presentation" ruleid="#news dt/508"><div class="cssHead focusRow " role="listitem"><span class="cssSelector ">dt</span> {</div><div class=" " role="group"><div class="cssPropertyListBox " role="listbox"><div class="cssProp focusRow editGroup " role="option"><span class="cssPropName editable ">left</span><span class="cssColon ">:</span><span class="cssPropValue editable ">0.5em</span><span class="cssSemi ">;</span></div><div class="cssProp focusRow editGroup " role="option"><span class="cssPropName editable ">position</span><span class="cssColon ">:</span><span class="cssPropValue editable ">absolute</span><span class="cssSemi ">;</span></div><div class="cssProp focusRow editGroup " role="option"><span class="cssPropName editable ">width</span><span class="cssColon ">:</span><span class="cssPropValue editable ">7.5em</span><span class="cssSemi ">;</span></div></div></div><div class="editable insertBefore " role="presentation">}</div></div><a class="objectLink objectLink-sourceLink a11yFocus "><div class=" "><br><div class="cssRule insertInto cssEditableRule " role="presentation" ruleid="#news dd/514"><div class="cssHead focusRow " role="listitem"><span class="cssSelector ">dd</span> {</div><div class=" " role="group"><div class="cssPropertyListBox " role="listbox"><div class="cssProp focusRow editGroup " role="option"><span class="cssPropName editable ">margin-bottom</span><span class="cssColon ">:</span><span class="cssPropValue editable ">10px</span><span class="cssSemi ">;</span></div><div class="cssProp focusRow editGroup " role="option"><span class="cssPropName editable ">padding-left</span><span class="cssColon ">:</span><span class="cssPropValue editable ">8em</span><span class="cssSemi ">;</span></div></div></div><div class="editable insertBefore " role="presentation">}<br><br>背景やボーダーを指定したい時はddに。<br></div></div><br></div></a></div><span class="cssSelector "><br></span>
]]>
</description>
<link>https://ameblo.jp/einsx/entry-10473038265.html</link>
<pubDate>Thu, 04 Mar 2010 01:34:48 +0900</pubDate>
</item>
<item>
<title>フッターを下につける</title>
<description>
<![CDATA[ <pre>html, body{<br>height:100%;<br>}<br><br>#wrap{<br>position:relative;<br>width:100%;<br>height:100%;<br>min-height:100%;<br>}<br><br>body &gt; #wrap{<br>height:auto;<br>}<br><br>#mainbody{<br>padding-bottom:(フッタの高さ)px;<br>}<br><br>#footer{<br>position:absolute;<br>bottom:0;<br>height:(   )px;<br>right:0;<br>}<br><br><br></pre>
]]>
</description>
<link>https://ameblo.jp/einsx/entry-10472896045.html</link>
<pubDate>Wed, 03 Mar 2010 22:50:11 +0900</pubDate>
</item>
</channel>
</rss>
