CSS初心者スレッド＝４ｔｈ＝

952 ：Name_Not_Found：2008/12/03(水) 02:59:10 ID:???

質問なんですが

　　　　　こうやって
　　　文章を改行して
　　中央揃えにするのを
　壺というらしいんですが

やはり、こうして
どっちかにそろえたほうが
読みやすいんでしょうか。

（サンプルとして二つのページを作ってみました）
壺
http://www.geocities.jp/caphawk12001/azoids/bellflau.html
左揃え
http://www.geocities.jp/caphawk12001/0001.html

上のは小説で携帯電話で読めるようにＣＳＳを
作ってみたとき、細くなったのが叙情的で
あってるなと思ってそのままＰＣ版でもつかったんですが
読み辛かったらすいません

953 ：Name_Not_Found：2008/12/03(水) 07:12:51 ID:Un+SNvz6

読みづらい

954 ：Name_Not_Found：2008/12/03(水) 12:34:15 ID:???

おまえの場合は書き方云々じゃなくて漢字を知らないだけだろ？

955 ：Name_Not_Found：2008/12/03(水) 12:37:15 ID:???

なんで解った　?

956 ：Name_Not_Found：2008/12/03(水) 15:31:37 ID:???

>>952
思い切って晒すとはおまい勇気あるなｗ

とりあえず左に揃えてくれた方が読みやすい。
どうしても中央揃えで演出したいなら、物語の内容を語った出だしの「統率は～物語」までを、
他の文章と差別化して中央にすればいい。

あと、改行ぶつ切り杉で読みにくいよ。
句読点の後だけでいいよ。

それから、<p>は段落なんだから、1文ごとに使うのは乱用しすぎじゃね？

957 ：Name_Not_Found：2008/12/03(水) 16:19:22 ID:???

line-heightも調整したほうがよくね？

958 ：Name_Not_Found：2008/12/03(水) 16:25:03 ID:???

いつからここは個人サイトの評価スレになったんだｗ

959 ：Name_Not_Found：2008/12/03(水) 18:55:18 ID:???

行間1.7くらいで
読みにくい

960 ：Name_Not_Found：2008/12/03(水) 19:00:18 ID:???

ありがとうございます。

>>956
とりあえず左に揃えて
改行も見直します。

あと<p><p>ですが
なんか使い方勘違いしてたようです。
すぐに直します。すいませんでした。

>>957
line-height　ってブラウザごとに処理が変わるから
避けてたんですが、使ってみます。

>>958
ごめん。
壺の例が自分の書いたやつぐらい
しかなかったんです。
他の人のを挙げるのも晒してるようだし

961 ：Name_Not_Found：2008/12/03(水) 19:57:46 ID:???

中央可変の3カラムと
横方向に可変する角丸(枠が線)のボックスを実現する裏技ないですか？
ご教授ください

962 ：Name_Not_Found：2008/12/03(水) 22:15:15 ID:???

>>961
別に裏技じゃなくてもStrictにこだわらなきゃ簡単だろ
勉強してこい

963 ：Name_Not_Found：2008/12/03(水) 23:05:09 ID:???

googlemapのAPIキーを取得して複数のページに地図を表示しています。
当然ですが、現在は各ページのヘッダ部にAPIキーを記述しています。
今後似たようなページが100枚を越える予定です。
で、APIキーの部分が変更されたときメンテナンスが大変なので
この部分だけを呼び出すようにしたいのですが、よい方法があったら
教えてください。

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />

<script
src="http://maps.google.com/maps?file=api&v=2.61&key=
APIキー&datum=wgs84"
type="text/javascript" charset="utf-8"></script>
<title>　　</title>
</head>

964 ：Name_Not_Found：2008/12/03(水) 23:26:21 ID:???

しょれのどこがCSS ?

965 ：Name_Not_Found：2008/12/04(木) 10:18:57 ID:???

text/cssのとこじゃね？

966 ：Name_Not_Found：2008/12/04(木) 10:32:00 ID:???

text/cssはhtmlのmeta要素のcontent属性の値だから残念ながらCSSじゃないな

967 ：Name_Not_Found：2008/12/04(木) 11:17:07 ID:???

965は本気でそう思ってるわけじゃないと思うぞｗ

そろそろこのスレも終わりだな。

968 ：Name_Not_Found：2008/12/04(木) 19:20:34 ID:???

963です。
質問がわかりづらくてすみませんでした。
src="http://maps.google.com/maps?file=api&v=2.61&key=
APIキー&datum=wgs84"
の" "のAPIキーの部分が大変長く、他にテキストファイルを作って
呼び出せるようにできたらと思って質問しました。
板違いなようなのでこれにて失礼します。

969 ：Name_Not_Found：2008/12/05(金) 03:45:00 ID:???

>>968
外部にjavascriptの配列でも作って参照したらいいよ

970 ：Name_Not_Found：2008/12/05(金) 20:08:29 ID:???

>>969
ありがとうございました。
調べてみます。

971 ：Name_Not_Found：2008/12/07(日) 17:59:41 ID:???

ちょっとスレ違いな質問ですが
ショッピングカートのCGIで商品閲覧ページを出力する際

1.実店舗の商品配置と同じと考えてCSSでレイアウトを行うべきか
　それとも
2.商品の一覧表と考えてテーブルで配置するべきなのか

迷っています
皆さんの意見は如何でしょう？

もし、この手の質問に応じてくれるスレッドが有るのなら
誘導していただいても結構です
自分で検索してもそれらしきスレを見つけられなかったもので

972 ：Name_Not_Found：2008/12/07(日) 18:36:06 ID:???

両方作るってのはだめなのか。

自分はPHPでRSSフィードを構築して発信してるけど
IE6とかRSSをアドオンなしではとれない人のために
テーブル型とリスト型でも更新履歴を見れるようにしてるよ。

973 ：Name_Not_Found：2008/12/07(日) 19:48:53 ID:???

ｱﾎ?

974 ：971：2008/12/07(日) 19:54:27 ID:???

あ、そうか
どっちか、どれか、だけって考えてるから
愚問を発してしまうんだな
頭固いな俺
>>972
(-_^)--☆ﾊﾟﾁｯ Thanks !!

975 ：Name_Not_Found：2008/12/07(日) 21:24:25 ID:r/8gWDq7

意味が分からん・・・かみ合ってないだろ・・・・

976 ：Name_Not_Found：2008/12/07(日) 23:17:31 ID:???

俺の歯の噛み合わせが悪いのを何故知ってる

977 ：Name_Not_Found：2008/12/08(月) 13:41:38 ID:???

dd {
background: url(images/arrow.gif) center left no-repeat;
}

<dl>
<dt>2008年12月2日</dt>
<dd>更新しましたよ。</dd>
<dt>2008年12月1日</dt>
<dd>更新しましたよ。</dd>
</dl>

って書くと<dd>にもフツーは背景画がでますよね。
でも、win firefoxではでません。
こういう書き方じゃだめなんでしょうか？

978 ：Name_Not_Found：2008/12/08(月) 14:10:05 ID:???

center left　って順番逆だろｗ

979 ：Name_Not_Found：2008/12/08(月) 15:05:50 ID:???

質問させてください。

<div style="float:left; width:100px; height:100px; margin:10px; background-color:blue;"></div>
<p style="background-color:red;">
テスト
</p>

これだとpタグの背景色が左側に伸びてしまいますが、回避する方法はあるでしょうか？
(赤い背景色も「テスト」という文字と一緒のように、青い四角の右側だけにしたいんです)

980 ：Name_Not_Found：2008/12/08(月) 15:51:24 ID:???

>>979
pをdisplay:inlineにする
ただし不都合出ると思うがなｗ

981 ：Name_Not_Found：2008/12/08(月) 15:58:31 ID:DHiDUp2K

質問です。
なんと説明して良いのか分からないのですが、、、

CSSで「float: left;」を使用して作ったページを
Safariで見てみると、「float: left;」で指定した部分下の
画像やテキストが回り込んで来てしまうのですが、

「float: left;」を使用する場合には通常
何か追加で指定しなきゃいけないタグや数値とかありますか？
というかあまり「float: left;」は使えないんでしょうか？

982 ：Name_Not_Found：2008/12/08(月) 16:00:56 ID:???

回り込みを解除したいならclearしないとダメ

983 ：Name_Not_Found：2008/12/08(月) 16:10:51 ID:DHiDUp2K

>>982
質問に答えていただき感謝なのですが、、、
何分素人でございまして、、
具体的にどのような処理を行えばいいでしょうか？

本当にすいません。。。

984 ：Name_Not_Found：2008/12/08(月) 16:15:28 ID:G0qlPDeu

ggrks

985 ：Name_Not_Found：2008/12/08(月) 16:19:00 ID:???

>>983
>>4

986 ：Name_Not_Found：2008/12/08(月) 16:19:16 ID:???

>>983
例えばこんなのとか
ttp://onohiroki.cycling.jp/comp-css-ex1-caption-box.html

987 ：Name_Not_Found：2008/12/08(月) 16:31:06 ID:DHiDUp2K

>>985
>>986
ありがとうございました。
とりあえず頑張ってみます。

988 ：Name_Not_Found：2008/12/08(月) 20:50:48 ID:???

>>987
勉強するなら
http://hp.vector.co.jp/authors/VA022006/css/
clearについては
http://hp.vector.co.jp/authors/VA022006/css/visualren.html#clear

989 ：Name_Not_Found：2008/12/09(火) 04:51:12 ID:???

border周りについて質問です。
例えば、

margin:10px;
padding:3px;
border:1px solid gray;
height:20px;

だった場合に、占める高さは、10x2+3x2+1x2+20で良いのでしょうか。
それとも、borderが他の3つの属性のどれかに含まれていて、
10x2+3x2+20だったりするのでしょうか。

990 ：Name_Not_Found：2008/12/09(火) 12:43:23 ID:???

質問です。
@wikiを使用しているんですが、3カラムデザインを使用しているときに
http://www1.atwiki.jp/guide/pages/270.html#id_ec031ab0
この「#nomenu2()」プラグインを使用して、一部のページのみを2カラムにしたいんですが、
このプラグインを使うと右メニューがあった場所が空白になって表示されてしまいます。
どうすれば空白をなくせるんでしょうか？
いろいろいじったんですが、真ん中のコンテンツとかぶったり、左メニューの下にいったりと、上手くできません。

991 ：Name_Not_Found：2008/12/09(火) 12:46:47 ID:???

>>989
仕様としては含まれていないのが正解だが
IE6の後方互換モードなど、バグで含まれていないのもある
ttp://www.remus.dti.ne.jp/~a-satomi/bunsyorou/Doctype-Switch_example.html#box-sizing-behavior

992 ：Name_Not_Found：2008/12/09(火) 12:47:58 ID:???

>>990
それCSSの問題じゃなくね？
CSS外して切り分けしてみ

993 ：Name_Not_Found：2008/12/09(火) 12:48:58 ID:???

って>>991まちがった
>仕様としては含まれていないのが正解だが
>IE6の後方互換モードなど、バグで含まれていないのもある
↓
仕様としては含まれていないのが正解だが
IE6の後方互換モードなど、バグで含まれているのもある

994 ：Name_Not_Found：2008/12/09(火) 12:51:54 ID:???

>>992
回答ありがとうございます。
CSS外して…とはどういうことでしょうか？
CSSを適応させないでHTMLだけでページを作る、という意味ですか？

995 ：989：2008/12/09(火) 14:29:28 ID:???

>>991 >>993
ありがとうございます。
自分も起き抜けで変なことを書いています。
paddingはheightの内側なのに足してるorz

・・・と思ったら、貼ってもらったページではpaddingも含まれないのが本来の仕様だとある。
うわーんわからなくなってきたよ～｡･ﾟ･(ﾉД`)･ﾟ･｡

996 ：Name_Not_Found：2008/12/09(火) 14:46:48 ID:???

>>995
仕様では
コンテンツ領域 = height

後方互換の場合や一部のブラウザの場合
コンテンツ領域 = height　+ padding + border
で計算されることがある

それとmarginの上下は相殺されたりもする

ちなみに>>989の順番だけど
外側からmargin→border→padding→heightが正解

997 ：Name_Not_Found：2008/12/09(火) 20:39:14 ID:???

>>995
paddingはheightの外側だよ

998 ：Name_Not_Found：2008/12/09(火) 22:49:39 ID:???

>>978
おお、そんなところで引っかかってたのか！
ありがとう

999 ：初心者：2008/12/10(水) 09:06:47 ID:???

CSSにてテーブル内のセルに画像を設定しようとしているのですが、
htmlの内部に直接CSSを記述した場合には、正常に動作するのに
外出しにするとうまく行きません。
(画像が表示されない。)
一体何処が誤っているのでしょうか？
＜＜①：OKなパターン　＞＞
【CSSをhtmlに直接埋め込んだ場合】
<style type="text/css">

</style>

1000 ：初心者：2008/12/10(水) 09:07:44 ID:???

２つめ
【html内のtable】
<table class="class_table_back">
　　<tr>
　　　　<th>Webディレクター</th>
　　　　<th>Webデザイナー</th>
　　　　<th>Webプログラマー</th>
　　</tr>
　　<tr>
　　　　<td>A氏</td>
　　　　<td>C氏</td>
　　　　<td>E氏</td>
　　</tr>
</table>
＜＜②：NGなパターン　＞＞
【CSS部分を外出しにした場合(style_sheet.css)】
<LINK href="CSSテストページ/style_sheet.css" type=text/css rel=stylesheet>
table.class_table_back th, table.class_table_back td
{
border: 2px #2b2b2b solid;
color: blue;
background-image: url(CSSテストページ/line_bg.gif);
}
table.class_table_back
{
/* background-image: url(CSSテストページ/line_bg.gif); */
}

1001 ：１００１：Over 1000 Thread

このスレッドは１０００を超えました。
もう書けないので、新しいスレッドを立ててくださいです。。。