<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
<channel>
<title>スタイルシート | 雑記帳</title>

<link>http://kannoyuuki.com/memo/movabletype/css/</link>
<description></description>
<category>スタイルシート</category>
<language>ja</language>
<copyright>Copyright 2008</copyright>
<lastBuildDate>Fri, 07 Nov 2008 11:33:13 +0900</lastBuildDate>
<generator>http://www.sixapart.com/movabletype/</generator>
<docs>http://blogs.law.harvard.edu/tech/rss</docs> 

<item>
<title>クラスと要素の関係</title>
<description><![CDATA[<p>あれこれ指定しているうちに、何がなんだかわからなくなることがしょっちゅうなので覚え書き。</p>

<h3>要素の中にクラスを指定した場合</h3>
<h4>(HTML)</h4>

<div class="source">
<pre>&lt;h2 class="hoge"&gt;
　：
　：
&lt;/h2&gt;</pre>
</div>

<h4>(CSS)</h4>
<div class="source">
<pre>h2.hoge {
　：
　：
}</pre>
</div>

<h3>クラスが指定された要素の場合</h3>
<h4>(HTML)</h4>
<div class="source">
<pre>&lt;div class="hoge"&gt;
&lt;h2&gt;
　：
　：
&lt;/h2&gt;
&lt;/div&gt;</pre>
</div>

<h4>(CSS)</h4>
<div class="source">
<pre>.hoge h2 {
　：
　：
}</pre>
</div>]]></description>
<link>http://kannoyuuki.com/memo/2008/11/000335.php</link>
<guid>http://kannoyuuki.com/memo/2008/11/000335.php</guid>

<category domain="http://www.sixapart.com/ns/types#category">スタイルシート</category>


<category domain="http://www.sixapart.com/ns/types#tag">CSS</category>

<pubDate>Fri, 07 Nov 2008 11:33:13 +0900</pubDate>
</item>

<item>
<title>文字サイズを大きくしたときにもレイアウトが崩れないようにしたい</title>
<description><![CDATA[<p>ひとつの単語が長いと、文字を大きくしたときに思わぬ結果を招いてしまう。</p>

<img src="http://kannoyuuki.com/images/memo/08_11062059.gif" alt="overflow処理前" width="476" height="180" />

<p>英単語はその長さのまま折り返されることなく表示されてしまうので、たちが悪い。</p>

<h3>文字がはみ出てしまうときの処理（ブラウザに委ねる場合）</h3>
<div class="source">
<pre>#hoge {
	width: 200px;
	overflow: auto;
}</pre>
</div>

<p>基本的には下のように、スクロール表示になる。</p>

<img src="http://kannoyuuki.com/images/memo/08_11062111.gif" alt="overflow処理後" width="476" height="180" />

<p>あまり美しくないが、レイアウト自体が崩れてしまうくらいなら、こちらのほうがマシ。</p>
]]></description>
<link>http://kannoyuuki.com/memo/2008/11/000327.php</link>
<guid>http://kannoyuuki.com/memo/2008/11/000327.php</guid>

<category domain="http://www.sixapart.com/ns/types#category">スタイルシート</category>


<category domain="http://www.sixapart.com/ns/types#tag">レイアウト</category>

<pubDate>Thu, 06 Nov 2008 20:59:34 +0900</pubDate>
</item>

<item>
<title>リストの中身を横に並べたい</title>
<description><![CDATA[<p>文章と同じように横に並べたいだけなら、display: inline; で十分かと。</p>

<h3>リストの中身を横並びにする</h3>
<div class="source">
<pre>li {
	display: inline;
}</pre>
</div>

<p>回り込みさせる場合は以下。</p>

<div class="source">
<pre>li {
	float: left;
}</pre>
</div>

<p>ちなみにリストの記号を取るには。</p>

<h3>リストのスタイルをノーマルにする</h3>
<div class="source">
<pre>li{
	list-style: none;
}</pre>
</div>]]></description>
<link>http://kannoyuuki.com/memo/2008/11/000319.php</link>
<guid>http://kannoyuuki.com/memo/2008/11/000319.php</guid>

<category domain="http://www.sixapart.com/ns/types#category">スタイルシート</category>


<category domain="http://www.sixapart.com/ns/types#tag">リスト</category>

<pubDate>Wed, 05 Nov 2008 15:28:13 +0900</pubDate>
</item>

<item>
<title>必要な要素だけを表示したい（スタイルシート）</title>
<description><![CDATA[<img src="http://kannoyuuki.com/images/memo/08_10141325.jpg" alt="デフォルトのメインインデックス" width="400" height="300" />

デフォルトで表示される画面は、かなり見づらい。

カスタマイズしようとソースを見ると、こちらも非常に見づらく、
何が必要で何が不要なのか判断しづらい。

ここではレイアウトやデザインはあとで考えるとして、
まずは必要な要素だけを表示したい。]]></description>
<link>http://kannoyuuki.com/memo/2008/10/000029.php</link>
<guid>http://kannoyuuki.com/memo/2008/10/000029.php</guid>

<category domain="http://www.sixapart.com/ns/types#category">スタイルシート</category>


<category domain="http://www.sixapart.com/ns/types#tag">CSS</category>

<category domain="http://www.sixapart.com/ns/types#tag">MovableType</category>

<category domain="http://www.sixapart.com/ns/types#tag">カスタマイズ</category>

<category domain="http://www.sixapart.com/ns/types#tag">スタイルシート</category>

<pubDate>Wed, 15 Oct 2008 09:38:00 +0900</pubDate>
</item>

</channel>
</rss>
