CSS初心者スレッド＝5th＝

質問です。
<a href="a"><div class="b"></div></a>
は駄目なんですよね？
divのかわりになにを使えばいいのでしょうか？
よろしくお願いします。

>>433
スレ違い、それはHTMLの問題

いつまでたってもレイアウト用のプロパティでないな
いったいどういうつもりなんだろうか

>>433

div a /a /div
span a /a /span

>>433は無言で他スレに行きました↓
http://pc11.2ch.net/test/read.cgi/hp/1230131512/471-

DW8で作業中で、現在下のような感じでヘッダ内にh1とその下にナビを
入れようとしてます。
ナビのli要素をインラインにすると普通にul全体もヘッダ内にあるのですが、
li要素をブロック、フロート左にするとul要素全体がヘッダの下に飛び出て
しまいます。これをヘッダ内におさめる方法はないでしょうか？
【HTML】
<div id="header">
<h1>株式会社ロゴ</h1>
<ul>
<li><a href="#">TOP</a></li><li><a href="#">ななな</a></li><li><a href="#">あああ</a></li>
</ul>
</div>
【CSS】
#header {
margin: 0px;
padding: 0px;
}
#header h1 {
margin: 10px 0px 0px 10px;
padding: 0px;
}
#header ul {
margin: 0px;
padding: 0px;
}
#header li {
padding: 0px;
margin: 0px;
display: block;
float: left;
}

>>438
よくわからないんだけどどういう風に表示したいのか画像か文字で出力後を眼で見えるように書いて

-----------------------------------------------------
| titlelogo　　
|　　　　　　　　　　　　　　　　　　 　
|----------------　　　　　　
| btn1 | btn2 | btn3 |
-----------------------------------------------------

こんな感じです。
右側の縦の線入れると崩れるんで書いてないだけです。
ボタンはテキスト表示なんでインラインでも良いのかもしれないですが
画像に変更する際に不便だと思いまして。

>>438
clearfixでググるがよろし

#header h1 {
margin: 10px 0px 0px 10px;

ここでヘッダのh1に右マージン入れてるからじゃなくて？

有難うございますここから先はググって自分でやってみます。
>>442
右マージン0にしてみたんですが変わりませんでした。
CSSﾑｽﾞｶｼ…

float 指定しているのにwidth指定してないからじゃないの？
floatにはwidth必須。

>>444
それは2.0
2.1ではもうwidthは不必要

>>445
現実的には必須じゃね？
css2.1に対応してないブラウザのシェアが多すぎる。

どっちにしろ指定しないとデザインむちゃくちゃになるだろ

>>446
何を言ってるんだ
2.0基準なんてネスケ6だけで、IE6でさえ2.1の扱いだぞ
IEはバグなんだけどさｗｗｗ

>>447
そんなのは内容による

それはおまいがデザイン放棄してるからだよ

>>449
おまえ逃げるなよＩＤ出せよコラ

>>444
>>438で書いたのが中途半端でスイマセン。ここにレスするにあたって
要素を少なくしてシンプルにしたつもりだったんですがその際にｆｌｏａｔも消して
しまっていただけで、一応、指定はしていたんですが無理でした。
最終的にはclearfixの方法で解決しました。
有難うございました。

452＝438の私です。

>>438みたいなヘッダぐらいなら、clearfix使わなくても
ulにemで高さ指定するとか、#headerにナビを加えた高さ指定するなりして
次の要素で普通にclearした方がいいんじゃね。
clearfixって見えないだけで、余計な要素が挿入されてることには変わりないんでしょ？

一般的なclearfixはCSSだけで完結する

>>454
有難うございます、教えて頂いた方法も明日試してみます。

>>444=>>446=>>454なのかな…
もうちょっと自分が勉強してから来てくれないかな、スレを混乱させるだけだから

親要素の高さを決める方法
ttp://blog.d-spica.com/entry/080418clear.html

overflowを使わずに1と2の併用で対処できるなら
3の擬似要素は余計なんだよ？

そのサイトに言えば

* {
padding : 0;
margin : 0;
}

こんなことやってる人いるけど？　こんなんｱﾘなの？

やってますが何か。

何がだめだと思ったの？

>>461,>>462
許してやれ
初心者スレなんだから

>>460
普通にダメ

>>464
理由を簡素に述べよ

初心者はそれでいいよ
ダメなのにぶつかったら違うの使えばいい

初心者でも上級者でもやる人はやるしやらない人はやらない

>>460
やらない理由は「reset.css」とか「初期化　css」でググって自分で理由をつけろ

>>468
答えになってないぞｗ

擬似フレームでサイトを作ったんだけども
常にブラウザの真ん中に内容を持ってきたい場合はどうすればいいの？

1emは実質何pxですか？

フォントによる

というか設定による
ブラウザで設定してるフォントの大きさだ

全体を中央寄せにしたいんですが、全体を囲んでいる要素に対して
{text-align: center;}
を使うと、IEでは中央寄せになるのですが、他のブラウザ(firefox,safariで確認)では中央寄せになりませんでした。
で、多くのCSS関連事項を載せているサイトを参考に、上記と一緒に、
{margin: 0 auto;}({margin-left: auto; margin-right: auto;})
も記述してみました。
ところが、firefoxではどちらをやっても、テキストしか中央寄せにしてくれません。
全体を囲むボーダーも、レイアウトも全て中央寄せにしたい場合はどの様に記述すれば良いでしょうか？
回答宜しくお願いします。

>>469
答えはググれば自分で出せるだろ

>>474
widthを指定してないのに中央になるはずないだろ

c{width:700;margin-left:auto;margin-right:auto;}

<div id="c">
<div id="h"></div><div id="b"></div><div id="f"></div>
</div>

訂正な

c{width:700px;margin-left:auto;margin-right:auto;}

#cな

すいません。事故解決しました。
body要素でなく、*要素に適用すると、中央寄せになりました。

ですが、どうしてbody→*にしたことで、解決したのでしょうか？
*も全体を囲む要素ですよね？
body(もしくは、全体を囲む要素α)と同じではないのでしょうか？

>>476
すいません。書いてなかっただけで、widthは指定していました。
記述漏れです。すいません。

h3だけtext-indentをかけようとしたのですが
p,ulにまで適用してしまいます
どういう理由なんでしょうか？
よろしくお願いします

<h3 id="topick">topick</h3>
<p>
<ul>
<li class="item_Name">黄金</li>
</ul>
</p>

#topick{text-indent:-999px;}

>>479-480
お前は body{width: 1000px;} とでもしているのか？

>>481
そのHTMLとCSSだけでも適用されるのか？
てか、<p>の中に<ul>を入れるなよ

body{width: 100%; margin-top: 10px;}　としてます。
これはやめたほうがいい使い方なんでしょうか？

>482
これだけでそうなるです
pいらないね、今消してきた
ついでにものごっそ書き直したら直った
ありがと

質問があります。

divは横幅100%で表示させて、pは横幅600pxで且つテキストは
左寄せにしたいのですが、下記のようにやると左詰めで表示されてしまいます･･･。

<div id="a">
<p>ほげほげほげほげ</p>
</div>

div#a{
width:100%;
margin:0 auto;
background-color:#006600;
}

div#a p{
width:600px;
color:#fff;
}

詳しい人教えてください

すみません言葉足らずでした

誤
divは横幅100%で表示させて、pは横幅600pxで且つテキストは
左寄せにしたいのですが、下記のようにやると左詰めで表示されてしまいます･･･。

正
divは横幅100%で表示させて、pは横幅600pxの中央表示でテキストは
pの中で左寄せにしたいのですが、下記のようにやると左詰めで表示されてしまいます･･･。

div#aじゃなく
pにmargin:0 auto;

pにmarginレフトとライフにauto

>>483
そりゃ、width:100%の中央寄せには何の意味もないよ
bodyにmarginを指定したら、font-sizeみたいに中の要素にも継承されると思ってるとか？
*は全ての要素に適用させるもんだから、bodyと同じじゃないよ

>>487
>>488

ありがとうございました！
なるほどセンター表示したい要素に指定するんですね
text-alignと同じかと思ってました

>>489
あ、そうなんですか。レスありがとうございます。
参考にしてたサイトでbodyにwidth:100%;を指定していたもので。
勉強になりました。

bodyにwidth100%を指定する意味のあるときもある
ただ意味もわからないのにやるな、余計わからなくなるだけだ

CSSの本を買う前にXHTMLの本も買った方がいいですか？
HTMLの本はあるんですが、XHTMLは初めて知ったんでアドバイスお願いします

XHTMLとHTMLの差はごく僅かだから
HTMLをマスターしてるならネットで少し調べる程度で十分だと思う
あとHTMLでもCSSは使えるし無理にXHTMLにすることもないかと

そうなんですか。
90年の本なので心配でしたが、ちょっと調べる程度の拡張ならCSSに突入しようと思います。
ありがとうです。

>拡張
>突入
なにげに言葉選びが危ない。

HTML 1.0の仕様が出たのが93年なんだがｗ
90年代の本ってことだよね？

質問です。

#CSS
li.a { list-style-position: inside; border: 1px solid #000; }
li.b { list-style-position: inside; border: 1px solid #000; width:200px; }
li.c { list-style-position: inside; border: 1px solid #000; margin-right:600px; }

#HTML
<ul>
<li class="a">aaa</li>
<li class="b">bbb</li>
<li class="c">ccc</li>
</ul>

IE7で li.b だけマーカーがボーダーの外部になってしまいます。
Fx3では、すべてボーダー内部に収まっています。

なぜ？？？

a をクラスに使ったら、リンクになっちゃうから
例として文字が不適切　だよね

ならないよ

要素名とクラス名の名前空間は別

すまんが質問
ロールオーバーでマウス乗せたら画像が変わるようにしたいんだけど
画像はリンクするためのものではなく
単にマウス乗せたら画像が変わるようにしたいだけ
（<a href="hoge"><img src="honya"></a>ではない）
この場合、a:hoverは使わないよね？
CSSじゃなくてJSを使うべき？

質問です。
アウトラインで左右にボーダーを表示して、中にボックスを左右配置。
で、左右を-1ｐxずつずらして重なった部分だけアウトラインのボーダーを消したいです。
（上手く言えないので下でソース書いておきます）
これをブラウザで開くと、
firefox opera safariの3つは意図どおりに表示されるのですが、IEでは無理でした。
これをIEでも意図通りに表示させるにはどうすればいいでしょうか？

<html lang="ja">
<head>
<style type="text/css">
<!--
html body{
margin:0; padding:0;
width:100%; height:100%;
text-align:center; /*IE用*/
}

#outline{
width:612px; height:100%;
margin:0 auto;
border:solid 1px; border-width:0 1px;
color:#000;
}

#header{height:100px;}

#left , #right{
background-color:#fff;
height:300px;
border:solid 1px;
}

#left{
width:200px;
float:left;
border-left-color:#fff;
margin-left:-1px;
}

#right{
width:400px;
float:right;
border-right-color:#fff;
margin-right:-1px;
}
-->
</style>
<title>テスト</title>
</head>

<body>
<div id="outline">
<div id="header">　</div>
<div id="left">　</div>
<div id="right">　</div>
</div>
</body>
</html>

>>502
#left, #right { position: relative; }

>>504
おおおおお！！
こんな簡単に出来たんですね！本当にありがとうございます！助かりました。

すごく初歩的な事なのですが、ずっと疑問に思っていることがあります。

記述の仕方なのですが、
例1
#item{display: none !important;}
例2
#item{
display: none !important;
}
例3
#item{
□□□display: none !important;
□}
□の部分は空白が入ってる。タブ入れてる感じではなくエディタで確認すると半角スペースが
連続して入ってます。

1，2，3のどの記述が最も正しいのでしょうか？

全部正しい
どんなにスペース入れてもかまわない

質問です。
メルマガのバックナンバーをWebサイトで公開する予定なんですが、
メーラーの一般的な表示状態（textメール）を再現するためのCSS設定をわかる方いますか？
よろしくお願いします。

>>508
メーラーによって違う上テキストなんだからCSS無関係

>>509
そういう話ではないです。
全ての環境で完璧に再現させるという話ではなく、
例えば広く使われているwindows、outlookなんかのデフォルト設定を想定して、
表示がそれほど大きく崩れないCSS設定があれば聞きたかったのです。

「テキスト」の意味解って無いだろ ?

>>510
一言で言えば「スレ違い」

>>510
<pre>　</pre>
で十分じゃ

一緒にする必要性がわからん

すっごく初歩的な事訊くけど、IE7で幅を％指定しても正しく表示されないことってあります？狐だとちゃんとなるのに…

■css
.abc{width:100%;heignt:90px;background-color:#000000;}
■html
<div class="abc">ほにゃらら</div>
というように記述したんだが…どうやってもボックスが90%くらいにしか表示されない。どっかに記述ミスがある？
実は％指定使ったの初めてで…

親ブロックのマージンパディングでも消してないんじゃないの

CSS＋XHTMLで組んでるページの場合、文章（テキスト）の部分は、
XHTML標準だと必ず何か前後につけなきゃいけないんですよね？
<ol><ul><p>を使わない場合は、何をつければいいんでしょうか？
<li>だけつけるのですか？

>>517
日本語でおＫ・・・
ちょっと違うが、段落だとp、順序なしリストだとul、順序ありリストだとol、
段落引用だとblockquote、というように文意で付けてくれ
liだけなんてのはもっともっとどこまでも果てしなく存在しない

body直下に
インライン要素はダメ

たとえば<body>や、入れ子構造のかなり上位の<div>のCSSの中で
フォントの種類やサイズをしてしまっている場合で、特にその文章が
段落でも「・」「1.〜]でも引用でもない普通の文章の場合です。
ソースだけ見るとそこだけ何もついてないので、これでいいのかな、と思ったものですから。

文章の直前に<div>がついてるので、いいんですかね。
どうも<div>のイメージがレイアウト専用のタグのイメージがあるもので、
これから文章書くよ！っていう、文章専用のタグ宣言があるのかなと思いまして。

>>518さんの区別で考えて、単純に振り分ければいいのかもしれませんね。
ありがとうございましたm(_ _)m

>>517
そんな時のために<div>
ていうか大抵は<p>でいいんでね？

>>520
お前は・・・文章を構造化する以前に
まともな意味の通る日本語を書けるようにならないと駄目みたいだな・・・

普通の文章ならpでいいよ

>>521
全然そんなときのためにdivじゃねえええええええええｗ

つーかここCSSスレじゃん・・・
初心者スレと間違えて答えちまった

別に日本語は変じゃないと思うけどな。

わかりやすー（自演が

別に自演はしてないけどね。
いちいち宣言しろってか。

ちょ、ま、おま自演の意味すらわかってないってｗｗｗ
まあなんだ、強く生�`
そして2ちゃんは半年ROMれ

>>527
いや、そもそも
HTML / XHTML の問題だから
『スレ違い』

おまえもな。もう変な突っ込みやめろよ。

>>529
ごめん。ここも関連してるかなと思ったので。これから気をつける。

>>530
いいから半年ROMりなさい

むしろ3年はROMらないと無理だろ、こういう手合いは

しつこいよ。

>>534
おまえがだ
答えてもらったのにぶーたれて答えてくれたスレ住民を貶してスレに居座り続けて
いいかげん消えろ
おまえを疎ましいと思ってレスしてるのが一人だと思うな

>>531 の素直っぷりで許そう
あとは水に流して

どこにでもいるんだよな。
こういう勘違いさん。
これを雇ってる会社は大変だな。

何と言う典型的な「女史」
構うだけ無駄、馬鹿は死んでも直らない

これで社会人かよ、日本語も書けない学生だろｗｗｗ

雑談は別スレでやってくれ

はい！もう終わり！スレ汚すな！

雑談は雑談スレへ誘導してしまいましょう

(´-`).。oO（Web板総合雑談スレ5…）
http://pc11.2ch.net/test/read.cgi/hp/1158664316/

>>537
おまえも勘違いした知識しかもってないのに？
職場では怒鳴られて、２ちゃんで偉そうに振る舞うんですか？（笑）

>>543
http://pc11.2ch.net/test/read.cgi/hp/1158664316/

>>544
反論できなくなるといつもそれｗ

>>545
>>1
>CSS初心者の方のための質問スレッドです。

雑談は雑談スレへ
(´-`).。oO（Web板総合雑談スレ5…）
http://pc11.2ch.net/test/read.cgi/hp/1158664316/

【CSS】
.imgs{
width: 180px;
padding-top: 2px;
padding-bottom: 2px;
margin: 0 auto 0em;
border-style: solid;
border-color: #99ccff;
}

【html】
<div class="imgs">
<img src="***" />
</div>

このように書いているのですが、画像にマウスを乗せたときにボーダーの色を変えたいと思っています。
そこで、CSSに
.imgs a:hover {
border-color: #000000;
}
を追加してみたのですが、うまく色が変わりません。
どうすればいいのでしょうか。

.imgs a:hover {
border-color: #000000;
}

を

.imgs:hover {
border-color: #000000;
}

に変える

>>548
出来ました。高速な回答ありがとうございました!

>>548
IE6では動作しなかったのですが、これは仕様ですか？

>>550
IE6はa以外のhoverに対応してない
IE7からはOK

>>551
なるほど、安心しました。

６で動かないものに存在意義はない

IE6のシェアはFx以下だし
CSSなんて切っても意味が通じるもんなんだからhover程度動かなくても何の問題もない

ありえないよ

a以外のhoverが機能しなくても別に困らんだろ・・・ｊｋ

>>553
js使えばできるだろｚｋ

お前はあほか

おまえ煽るくせにie6でhover使うためのライブラリも知らないんだな

>>554の言うとおりだと思う
少なくとも私のサイトの場合はそうです

JS使ったら出来るに決まってんだろｗｗｗ
hover自体元々JSだってのｗｗｗ

>>554 >>560
日本ではIE7＞IE6＞Fxの順

>>562
私が>>554に同意したのは2行目の部分ね。
シェアの順番なんてあまり関係ない。
利用者が少ないブラウザならレイアウトが崩れてもいいの？
違うでしょ。

おれが言ってるのはそんな中途半端なもん作るなってこと
作るなら全部同じように見えるように作れと
そもそも存在する限りそれは必要だからつけたのであって必要でないものはつけるべきじゃない

特定の環境で動かないもの作るなとか
押しつけられる筋合いありませんがな

質問主の使い方では強調させたいだけだろうから、あればいい程度
シェアとかブラウザとか語りたいなら>>542でやればいい

別に押し付けてないよ
おれはおれの言いたいこと言ってるだけ
別にお前らがどんなの作ろうが知ったこっちゃないです

>>563
君は>>554の2行目「hover程度動かなくても何の問題もない」に同意するのか？
だったら最初の質問（>>547）自体する必要のない物になってしまうぞ。

あと、なんで突然レイアウトが崩れる話が出てくるのか訳わからん。

>>562
日本でもIE7＞Fx＞IE6ってのもある
ああいうのは調査機関によって違うからな

自分のサイトなら別にhoverやろうがやらまいが勝手じゃねえの
仕事、まして他人のサイトを作らせてもらう時にそう作らないといけないときは別だけどね
ここは日曜大工と仕事人が入り乱れてるから意見もまとまらないよ

いや、プロはこんなとこ来ないだろｗ
来てたとしたらこの低ラベルはｗ

質問です
http://ossan.fam.cx/up/gazo/src/1232948661450.jpg

ブラウザ確認をしてたらIE７では左の図のように中央にセンタリングされてるのですが
IE6で見ると、右の図のように左にずれてしまいます

何かいい解決策や参考になるHPがありましたら教えてください

>>570
定時10:00-22:00の零細企業ですが文句ありますか

li要素の中にimgを入れた場合、テキストと同じラインに並べるようにするにはどう書けばいいのでしょうか？
img画像は矢印→です。

すいません書き忘れました。

vertical-align:middle;を試したのですが完全に真ん中にはいかず
少し下よりになっていました。

vertical-alignを%かpxでプラスの数値を指定。
合わせて並べる文字もpxで指定。
ただし、ご存知のようにブラウザによっては文字のpx指定は
見る人の設定で大きさ変わります。

ちなみに−の数値で指定すると，もっと下にずれます。

>>571
ソースも出さずに何を言ってるんだ

>>572
ある、まず一つ上に答えろよプロ

>>573
ttp://hp.vector.co.jp/authors/VA022006/css/visualren.html#vertical-align
ttp://materia.useyan.jp/html/css_sample/vertical-align.htm
えるしってるか　テキストじたい　まんなかにあるわけじゃない

css3でazimuthは対応してますか？

2.0でも存在してるが

css1〜2.1では対応してるのは確認してますが3はどうなんでしょうか？

そこまで自分で調べられる知識があるなら
3も自分で調べりゃいいだろｗ

CSSって基本的に下位互換は保たれてるんじゃねーの？

つーかまだモジュールのWDも出てない部分じゃね
答えられる人間はいないだろう

CSSなんてバージョン表記ないんだからブラウザが対応する限り対応する

下位で一度廃止になったプロパティが上位で復活したプロパティもあるよ

>>583
バージョンも存在するし、古くから存在してるプロパティだって未実装のものなんかたくさんある

君はもうちょっと文章をよく読みなさい

どう見てもE8x6s37iが馬鹿なだけだな

おｋお前が馬鹿なのは分かった

意味なしage厨うぜえぇぇぇ

ID:E8x6s37i
css1
css2
css2.1
css3

これだけあるからな
勉強になったな＾＾

日本語の不自由な方なんですねわかります

583 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 14:22:20 ID:E8x6s37i
CSSなんてバージョン表記ないんだからブラウザが対応する限り対応する

586 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 14:58:30 ID:E8x6s37i
君はもうちょっと文章をよく読みなさい

588 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 14:59:48 ID:E8x6s37i
おｋお前が馬鹿なのは分かった

591 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 15:03:07 ID:E8x6s37i
日本語の不自由な方なんですねわかります

583 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 14:22:20 ID:E8x6s37i
CSSなんてバージョン表記ないんだからブラウザが対応する限り対応する
583 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 14:22:20 ID:E8x6s37i
CSSなんてバージョン表記ないんだからブラウザが対応する限り対応する
583 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 14:22:20 ID:E8x6s37i
CSSなんてバージョン表記ないんだからブラウザが対応する限り対応する
583 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 14:22:20 ID:E8x6s37i
CSSなんてバージョン表記ないんだからブラウザが対応する限り対応する
583 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 14:22:20 ID:E8x6s37i
CSSなんてバージョン表記ないんだからブラウザが対応する限り対応する
583 名前：Name_Not_Found[] 投稿日：2009/01/27(火) 14:22:20 ID:E8x6s37i
CSSなんてバージョン表記ないんだからブラウザが対応する限り対応する

ｍ９ｐｇｒｗｗｗ

おまえ質問スレでliの中にp入れられないとかいってたやつだろｗｗｗｗｗｗｗｗｗ
今度はバージョンはないとかｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗ
きめえｗｗｗｗｗｗｗｗｗ

テキストエリアの文の固定ってできる？

　　　　　　　　　　　ｻｧ ｼｨﾉ ﾏﾀｰﾘﾉ ﾀﾒﾆ

　　　　　　　　　　　色ﾝﾅ ｽﾚﾆ 貼ﾙﾝﾀﾞﾖ♪


　　　　　　　　　　　　　　　　＼ ／
　　　　　　　　　　　　　　　　　　　　　　ｼｶﾀﾅｲｶﾗ ｼｨﾉ ｵｼﾘｻﾝﾉ
　　　　　　　　　　　〜γ⌒ヽ∧∧　　 ﾆﾎｲｦ ｶｶﾞｾﾃ ｱｹﾞﾙﾜ♪
　　　　　　　　　　　　.（ *　) ,iﾟーﾟ*)　　ｱﾘｶﾞﾀｸ ｵﾓｲﾅｻｲ♪
　　　　　　　　　　　　　Ｕ Ｕ"ヽ)ヽ)

　今ならもれなく、しぃのおしりの臭いがかげる掲示板

　しぃのマターリ掲示板
　http://jbbs.livedoor.jp/computer/22654/

レイアウト枠を中央に配置するにはどうすればいいんですか？
もしくはページの横幅を指定して、常に全体が中央に表示されるようにしたいんです。よくあるやつですが、どうやるのかがわかりません

その質問がこのスレで何度出たことか
ctrl+fで少しは調べろよｋｓｇ

>>598
テンプレ

ホームページビルダーでそれできますか？

ホーｗｗｗムｗｗペーｗｗｗジｗｗｗｗｗビｗｗｗルｗｗダーｗｗｗｗｗｗｗｗｗｗｗｗｗ

>>601
ホームページビルダーは単なるツール。
出来るか出来ないかは作成者の能力。

ホームページビルダーでできますよ。

どこを押せばいいんですか？
もう５日ぐらいやってるんですが、レイアウト枠の中の文字だけまん中にきてレイアウト枠がは左なんです

諦めろ

これができるソフトを教えてください。
XHTMLもできるやつ教えてください。ホームページビルダーHTMLなんです。

ソフトに依存する質問はスレ違いだから
↓で質問しましょう

ホームページビルダースレッドその36♪(・ω・)ノ
http://pc11.2ch.net/test/read.cgi/hp/1232966069/

>>605
それはソフトの使い方であってCSS云々の問題なのか？使ったこと無いからわからないけど。

誘導ありがとう！

今、CSSで悩んでいます。
それは、ヘッダー内に画像を印刷時のみ入れたいのですが、どのように記述して良いのかがわかりません。どなたかお力をお貸しください。

<link rel="stylesheet" href="xxxxxx.css" type="text/css" media="print">
プリントだけのcssつくんの。

あ、はい。それは既に作ってあります。
その「xxxxxx.css」のCSSにどのように記述していいのかが分かりません・・・・

ググレカス

ポイント時に、ゆっくりと背景色が変化するメニューを作りたいです。
横並びでブログ用（メニュー数や文字数がころころ変わる可能性アリ）なので、
画像で作ると都度手入れが必要になると考えられるため、
できればcssでと思っていますが、方法はあるでしょうか？

>>615
基本的にcssで「徐々に〜する」事は出来ないと思う。jsでおやり。

>>614
さんざんググってるのですが・・・orz

>>616
そうします、ありがとう。
「おやり。」がセクシー。

>>617
もっと真剣に探せよコラ
ていう基礎からCSS覚えないで都合のいいところだけつまみ食いしても
上手くいかない場面がこれからも出てくるよ。

基本は以下のcss。あとは自分なりの設定をいろいろ付けていくの。

<link rel="stylesheet" href="for-print.css" type="text/css" media="print">
for-print.css
#header {background:url(xxx.jpg)}

<link rel="stylesheet" href="for-screen.css" type="text/css" media="screen">
for-screen.css
#header {background:#fff}

>>619は分かりづらかったからこっちね。
要するに2つCSSを用意するのね。

<head>
<link rel="stylesheet" href="for-print.css" type="text/css" media="print">
<link rel="stylesheet" href="for-screen.css" type="text/css" media="screen">
</head>

for-print.cssには以下を記述
#header {background:url(xxx.jpg)}

for-screen.css には以下を記述
#header {background:#fff}

>>620の方法でもいいとうけど
XHTMLの使い方としては↓(display:none)の方が良くない？

<head>
<link rel="stylesheet" href="for-print.css" type="text/css" media="print">
<link rel="stylesheet" href="for-screen.css" type="text/css" media="screen">

<style>
/*for-print.cssには以下を記述*/
#print_only {display:none;}
</style>
</head>

<body>
<!--画像-->
<img src="xxx.jpg" id="print_only" alt="印刷時に表示" />
</body>
</html>

何やってんだ俺余計なことして自爆したOTL
>>621のはこう修正してください

<head>
<link rel="stylesheet" href="for-print.css" type="text/css" media="print">
<link rel="stylesheet" href="for-screen.css" type="text/css" media="screen">
</head>

<body>
<!--画像-->
<img src="xxx.jpg" id="print_only" alt="印刷時に表示" />
</body>
</html>


cssぶぶん
/*for-print.cssには以下を記述*/
#print_only {display:none;}

質問を理解してから答えようよ、 な ?

>>623
すいません、理解してないかも。
ヘッダー内に画像を入れるって質問だと思うんですが
>>620さんは背景のCSSでやろうとしてらしたので
それじゃなくてimgでやっちゃえばいいんじゃないかと思ったんですが

>>622
俺は初心者だがそれだと印刷時に画像が表示されないと思う

>>615
先読みが必要になるかもしれんが
一応GIFアニメをhoverの背景にすると似たような効果が

>>625
ああ、そういうことかｗ
すいません。

/*for-screen.cssには以下を記述*/
#print_only {display:none;}

ですか

それだと「印刷時以外に消す」だろ・・・

display:none

レイアウト崩れるよ？

というより画像をhtmlに入れてることが元々レイアウトを崩してる無駄

>>629
そんな時は

visibility:hidden;

でいい・・・のか？

>>628
問題なくね？印刷時に表示ってことは
印刷時じゃないときに表示しないってことだろ。

>>629
印刷時にその部分を空白にしておくのかどうかは
質問では書いてないけど空白で残したいならdisplay:none;は
使わない方がいいか

＞XHTMLの使い方としては↓(display:none)の方が良くない？

<ul>
<li>あいうえお</li>
<li>かきくけこがぎぐげご</li>
<li>さしすせそ</li>
</ul>

「かきくけこがぎぐげご」の文章が長くなって「がぎぐげご」が2行目になった場合、テキストの頭を揃えたいのですが
cssでtext-indent:1em;を設定すると「かきくけこがぎぐげご」自体が1em下がってしまいます。
「か」と「が」が同じラインになるように設定するにはcssにどう書けばいいのでしょうか？

ならばtext-indentを設定しなければ良いんでないの？

>>632
構造が違うだろバーカ
HTMLの構造を変えさせてまでやるんだったらCSSの必要はない

>>634
list-style-position:outside
でもデフォルトがそのはずだが

あんまりごちゃごちゃとプロパティ使うべきじゃない
レイアウトはパディングなりマージンで統一すべき

>>637
スレ違い

どこがやねんｗ

>>639
スレ違い

しね

>>641
スレ違い

雑談は雑談スレへ誘導してしまいましょう

(´-`).。oO（Web板総合雑談スレ5…）
http://pc11.2ch.net/test/read.cgi/hp/1158664316/

>>635-636
styleで丸や数字を設定すると2行目の文字が丸や数字の下にきてしまうので1文字分下げたいです。

>>644
デフォルトやlist-style-position:outsideならそうはならない
なるんならお前の設定が間違えてるだけ

>>645
すいません、よく見たら記述が間違っていたようです。ありがとうございました。

すいません“超”初心者ですのでスレ違いかもしれませんが
これからCSSを勉強しようと思ってます。

例えばテーブルで
<table width="800" border="1" cellspacing="1" cellpadding="0">
<tr>
<td>　</td>
<td>　</td>
</tr>
<tr>
<td>　</td>
<td>　</td>
</tr>
</table>

は、CSSでどう表現するのでしょうか？
またCSSを別ファイルにしてサーバーにUPするだけで、上のHTML（table）は必要なくなるのでしょうか？
知人のサイトのHTMLをコピペでDWに貼り付けると、タグが全然なかったものですので
どういう技なの？と・・これやりたい！と思った次第です。
宜しくお願いいたします。

CSSでテーブルは作れない
CSSとhtmlは全く別物

>>648 そうなんですか。。。ありがとうございます。
私はHPを作る際には主にテーブルを使っていましたので
これがスッキリしたら良いと思ってました。

前述の、知人のサイト等はソースをコピーしてDWに貼ってみると一切タグが
反映されず、これがCSSで別ファイルUPなのかと感心していました。

みなさんテーブルは使わないですか？

>>649

Webサイト制作初心者用質問スレ Part 206
http://pc11.2ch.net/test/read.cgi/hp/1233121174/

>>649
「表」を使うときにはテーブルを使う
レイアウト目的のテーブルは排除
おまえさんのはレイアウト目的だとしたらやめろ
ttp://az-store.nrym.org/reproduce/mynotes/lecture/

>>651
ありがとうございます。
レイアウトで使ってました。
教えていただいたサイトで１から勉強します。

使う使わないの話ではない
tableにするべきところはtableにする

>>653
それは使う使わないの話だ

ギャフン！！

年齢がバレるな

てか、650がｶﾞﾁｮｰﾝじゃね？

css厨はdivをfloatしまくってカレンダー作るんですか？ｗ
壮大なスケールのソースになりそうですね(笑)

それはCSS厨じゃなくてdiv厨だ

>>658
えるしってるか　カレンダーは　七曜表っていう表なんだよ
table使ったってレイアウト目的でも何でもないわ

>七曜表っていう表
へぇ〜へぇ〜へぇ〜へぇ〜

width を設定すると、幅に収まらない文字は自動で改行されますが、
幅に収まらない部分を、見えなくすることってできますか？

まず自分で探せ！
オバーフロー：ヒドゥンで探せ！

上手くいきました。どうもありがとうございます。

>>663
ヒドゥンって読むのか・・・
ハイディーンって読んでたよ

ヒデンと読んでるが

秘伝桁あふれの術！

英語っぽく書くとへデンとかヒデンだよな
ハイディーンも捨てがたい(ﾟ∀ﾟ)b

俺はヒデン
正確にはヒデュンなのかな？
解かんないやw

alignってアラインって読むんだぜ。知ってたか？
英語全く出来ないからずっとアリグンって読んでた。
gはどこに消えたんだよgは・・・納得いかん

俺中卒だけどその位は読めるぜ(;・ω・)
お前頭大丈夫かwww ←悪気はないw

lightととかね
gとhどこ逝っちゃたのって思うよね 俺>>671

・・・right。その通り。よく気付いたね。

PC用と携帯用と２つのcssを用意して１つのhtmlで両対応するサイトを運営しています。
(振り分けの方法は既に知っています。)

基本的に内容は同一なのですが、
外部リンクだけはPC用と携帯用で別々のものを表示したいのです。

そこでcssを用いて、携帯で閲覧した場合はPCの地図リンクを隠して、
PCで閲覧した場合は携帯の地図リンクを隠すという方法を取ろうと思い
その方法としてfontsizeを0にするとか色々な方法が浮かんだのですが、
普遍的な方法とはどのようなものなのでしょうか？

display

>>675
おお、まさに理想的な要素ですね。
ありがとうございます。

「これより下の背景色を変える」ことは出来ますか？

これより下の言語は日本語でおＫ

すいません
body {
background-color: #ffffff;
}
だと、サイト全体の背景色が白になりますが、
上半分は白、下半分は黒、のような指定がしたいです。

┌────────────┐
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
└────────────┘
分かりにくいかもしれませんが、こんな感じです。

そこから下の要素の背景を黒にすればいいだけ

縦長の黒画像用意して
background-color: white;
background-image: url("black.png");
background-position: left center;
background-attachment: fixed;

これでできるようなできないような

>>680
サイトの縦幅が短いので、大きなディスプレイで見ると下が白くなります。
┌────────────┐
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│■■■■■■■■■■■■│
│　　　　　　　　　　　　　 　　　　│
│　　　　　　　　　　　　　 　　　　│
└────────────┘
このような感じに

>>681
ありがとうございます、やってみます。

>>681
これは背景が固定されてしまうんですね。
希望のと少し違っていました。
ありがとうございました。

>>679
ここはテトリススレじゃねえ！！！！！！！！！！！！！

すいません、あれはテトリスのつもりではなくて、
レイアウトを視覚的に表そうとしただけです。

逆に背景全部黒にして上のほうの要素だけ背景白くすればいいんじゃね？

>>685
#u,#s{margin:0 auto;padding:0 auto;}
#u {background:#ffffff}
#s {background:#000000}

<body>
<div id="u">test</div>
<div id="s">test</div>
</body>

#u,#s{margin:0 auto;padding:0 auto;width:100%}
#u {background:#ffffff}
#s {background:#000000}

/* ここから下は消しておｋ */
#u,#s{height:300px}
/* ここまで */

<body>
<div id="u">test</div>
<div id="s">test</div>
</body>

適当な高さの白画像用意して
background-color: black;
background-image: url("white.png");
background-position: left top;
background-repeat: repeat-x;

質問です。
下記のサイトは、IE6以前の場合ずれてしまいますが、
どのような対策が必要でしょうか？

http://biyoubase.com/

ie6以前のブラウザはsorryページに誘導すればおｋ
ie6以前のブラウザはcssを読み込ませなければおｋ

IE6以前の人も多いので、CSSを読み込ませて見せたいのですが、
少し修正する程度では、この崩れは直らないのでしょうか。

ie6以前のブラウザとそれ以降のブラウザとでcssを振り分ければおｋ

ちなみにieには振り分ける書き方があるからググって調べればおｋ
ヒントつIF

説明ありがとうございます。

崩れが起こらないために、HTMLやCSSを修正したいのですが、
どこをどうするべきか検討がつきません。

詳しい方に、それも教えていただきたいです。

エスパーいとうさ〜〜〜ん

>>690のサイトは君のかね？
まずアフィをはずせ、質問する前の礼儀だ

>>697
きめえｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗ

IE6未満（書き方変だけどIE5.5以前とかね）とそれ以降では
CSSの記述による画面表示が違うけど
CSSの書き方によっては両方をカバー出来るから
そこらへんを検索すれば詳しいサイトはいっぱいある。

ちなみにこんなのね。
http://msdn.microsoft.com/en-us/library/cc351024(VS.85).aspx

>>690
いくつかあるが、箇条書き部分の
<li><a href="/skin/kansou/">乾燥肌</a></li>
<li><a href="/skin/oily/">脂性肌(オイリー肌)・混合肌</a></li>
のように改行して書いてあるコードを

<li><a href="/skin/kansou/">乾燥肌</a></li><li><a href="/skin/oily/">脂性肌(オイリー肌)・混合肌</a></li>〜
のように1行にしてみる（見た目用の改行を入れない）

まずこれを試す

アフィリエイトで不快な思いをさせてしまい、失礼しました。
トップページのアフィリエイトは外してきました。

ご意見ありがとうございます。
まず、700さんの方法を試してみます。

>>700
ご指摘いただいたとおりに修正すると、
無駄に空いていた行間がすっきりしました。
ありがとうございます。

しかし、
●「髪ヘアケア」と「髪ヘアケア（小ネタ）」の上下のズレ
●その周辺を横切るライン
これらは修正されないままです。
いくつか。とありましたが、まだ間違っている点があるのでしょうか？

>>702
IE6　IE7　CSS　表示崩れ　でググれ
下記を知らないならこれもやってみること。

ttp://css.uka-p.com/cause/browser_border.html

これも
ttp://css.uka-p.com/cause/browser_padding.html

いろいろなご指摘、ありがとうございました。

私には、まだまだ分からないことだらけですが、
勉強しながら修正していきます。

imgのsrcを外部ホストの画像にすると、
widthとheight指定しても大きさを変えられないんですが、
外部ホストの画像の大きさを変えることはできないんですか？

すいません。かんちがってました。
余裕で大きさ変えられますね。

>>706
外部ホストの画像を貼る＝直リンでいいのか？

直リンです。具体的にはリンクのバナーですね。

直リン？リンク先は画像じゃなくて、サイトですけど。

<img src="外部ホストのバナー画像" />
これをスタイルで大きさ変えられないと、勘違いしてただけです。

>>710
だからそれを直リンっていうの

>>706-711
久々に笑った

今>>706の頭の中はどうなってるんだろうなｗ

すいません、どなたかわかる方いたらお願いします。
テキストボックスの中にあらかじめ表示させておく文章を
リンクさせてるCSS側から指定することってできますか？
通常だったら↓のように記述すれば表示できますが
<textarea rows="5" cols="100">
感想や一言はこちらへお気軽にどうぞ。(ここの部分)
</textarea>

レンタルのメールフォームを使用しているため、リンク先のHTMLをいじることが出来ず・・・。
手段としてなにかあったら教えてください。

backgroundに、その文字の画像を作って指定するのは？

>>715
714です。
画像・・・！
それは思いつかなかったです。
やってみたいと思います！ありがとうございます！！

<body style="text-align: center;">

<div>あいうえお</div>

<table>
<tr><th>ほげ</th><th>あげ</th></tr>
<tr><td>１</td><td>２</td></tr>
</table>

</body>

としたときに、
テーブルがIEならセンタリングされるのに、
Firefoxだとセンタリングされません。
どうしたらFirefoxでもセンタリングできますか？

マージンをオートにすればいいと思うよ＾＾

>>717
思うようになりました。
ありがとうございます。

text-align:center;は文字のセンタリングなのでtableはセンタリングされない。
ふつうは左右のmarginにauto指定

http://sakuratan.ddo.jp/imgboard/img-box/img20090202152755.gif

擬似フレームでこんな感じのサイトを作っています。
緑の部分にメニュー、青の部分に内容が入るんですけれども
緑と青の間に仕切り線のような画像を挿入したいと思っています。
その場合はどこにどのようなコマンドを打ち込んでやればいいでしょうか？

疑似フレームって何？object要素の事？

ttp://developer.yahoo.com/yui/reset/で公開されているcssのリセットは
ie,Ff,op,sa,chの各最新ブラウザに対応してますか？

>>722
http://desperadoes.biz/style/p_frame.php
こちらを参考に作りました

object要素って何ですか？

<table>タグにmarginを指定できますか？

>>7のhttp://hp.vector.co.jp/authors/VA022006/css/

>>726
ありがとうございます。
もう一つなのですが、div要素を横に並べることは出来ますか？
┏━┓┏━┓
┃　 ┃┃　 ┃
┗━┛┗━┛
このような感じに。
divにinline要素を指定しても無駄なようで、困っています。

できる

>>728

<div style="width: 480px;">
<div style="float:left">menu1</div>
<div>menu2</div>
</div>

とやってもmenu1とmenu2が縦に並んでしまうのですが、間違っていますか？

>>729
floatさせる要素にwidthは必須
<div style="width: 480px;">
<div style="float:left; width=240px;">menu1</div>
<div>menu2</div>
</div>

>>729
というかその前にdivをcssで位置を設定してないじゃないか。

>>730
散々既出だがwidth必須は2.0で2.1では必要なく
2.0基準のブラウザなんてN6くらいしか存在しない

>>729
初心者の俺の推測ではそれでも横並びになるはずだけどな・・・なんでだろう
よく分からんがこれで試してくれ

<div style="width: 480px;">
<div style="width: 240px; float: left;"><h3>おっぱいメニュー１</h3></div>
<div style="width: 240px; float: right;"><h3>おっぱいメニュー２</h3></div>
</div>
<div style="cleat: both;">
<h1>(　ﾟ∀ﾟ)o彡゜オッパイ！オッパイ！</h1>
</div>

>>733
あんたおっぱい教の信者か何かなのか

>>733
今気づいたがタイプミスでclearがcleatになってたぜ
>>734
深い意味はないよ。テキストテキストテキストと同じ

>>733でも間違いではないが以下のやり方推奨
<div style="width: 480px;">
<div style="float:left">menu1</div>
<div style="float:left">menu2</div>
</div>
次のタグの出現ででclear:both

CSS2.1が普及してきたのって2002年くらいだっけ？
それより古いバージョンのブラウザだとIEやOperaとかでも崩れると思うよ。
必須ではないが、明示した方がいい。
このスレ的には必須といえば、必須かなみたいな。
XP以前のOSなんて使ってる奴は少ないだろうけど。

紛らわしいから、次スレで>>4を修正した方がいいかもしれん。

推奨（笑）

clearするなら親要素の中か、clearfix使えよ。
heightの指定もないし、親要素の高さがないままだぞ。
つか、メニューなら<li>のfloatにでもしとけ。

別に親の高さがなくたって問題はない場合が多いからそれは好きでいいだろ

親要素に背景や線つけたりすることはけっこうありそうだが。
未だ作成途中で詳細がわからないのなら、問題のないやり方を推奨すべきだよ。
スレタイに初心者ってあるし、あとで問題でたら困るだろ。

>>740
正しい仕様なのにそれを問題って言う方のほうが問題だっての

>>737>>740あたりは多分ここで何度もトンチンカンな解答してる奴だ
もうちょっと隠せないもんかね

"推奨"や"問題はない場合が多い"なんてトンチンカンなこと言い出したからだな

すいません。教えてください。
今、印刷用CSSを作っているのですが、サイズの大きいFLASHを印刷すると、途中で切れてしまい、1枚目しか印刷されなくなってしまいます。どのようにCSSを作れば、FLASHの大きさを変えずに2枚目に印刷できるようにCSSを作ることは出来ますか？教えてください。

レンタルのメールフォームをやめて適当なCGIを拾ってきて自分で設置するという選択肢も

>>744
スレ違い

そうですか・・・FLASH板ですか・・・

<!--
* {margin:0; padding:0;}
body {margin:0; padding:0; overflow:hidden; position:absolute; width:480px; left:50%; margin-left:-240px;}
#leftbox {margin:0; padding:0; height:100%; width:15em; position:absolute; left:2em; }
#mainbox {margin:0 0 0 15em; padding:0; height:100%; overflow:auto;}
#title{margin:0 15em 0 0; padding:0; height:100%; width:15em; position:absolute; top:0;}
#text{font-size:0.8em; color:#696969;}
#hitokoto{font-size:0.8em; color:#696969;}
#ALL {margin: auto auto auto auto;}
-->

こんな感じで、左右にボックス、上にタイトルって風にして作ってるんですけども
firefoxでは真ん中に持っていけたのにIEではレイアウトがぐちゃぐちゃになってしまいました。
どうすればいいですか？

>>748
状況を再現させる最低限のHTMLを出せ

>>749

<body>
<div id=ALL>
内容
<div id=hitokoto>内容</div>
内容
<div id=text>

<div id=leftbox>
内容
</div>

<div id=mainbox>
内容
</div>
</div>
</div>
</div>
</body>

こんな感じです。
cssの記述も更新を反映させてそれを見ながらいじってるようなド素人なので
多分記述に余計な部分やまとめられるところ等多く、お目汚しかと思いますが
何卒よろしくお願いいたします。

厨出現

>>748
IEを標準モードにしろ

dl、dt、ddでカテゴライズしているんだけど、
ddの右に、右端そろえの要素を加えたいのです。


主題
　　副題
　　　　内容内容内容　　日付
　　　　内容　　　　　　　　日付
　　　　内容内容　　　　　日付

こんな感じにしたいんですが、無理なのかなあ…

無理じゃない
頑張れ

spanやdivでfloat指定したりしているんですが、
どうしても二行になってしまいます。
もしお分かりでしたらどなたかお教えいただけませんか。

文章構造から作れってか？
ググレカス

副題がdt？主題がdt？
内容と日付はddの内部だよな？
日付だけspanで右寄せすれば改行されないかと

改行はされないが右寄せもされないだろそれｗｗｗ

dd relative span positionでおｋ

>>753
HTMLを見せろ

<dl><dt>題</dt>
<dd><div style="width: 200px;">
<div style="float:left; width=140px;">短めのタイトル</div>
<div style="float:right; width=10px; margin-left : 5px ;">090204</div>
</div></dd>
<dd><div style="width: 200px;">
<div style="float:left; width=140px;">ちょい長めのタイトル</div>
<div style="float:right; width=10px; margin-left : 5px ;">090204</div>
</div></dd>
</dl>

題
タイトル
日付
こんな感じになってしまいます。

<div>厨か

>>752
ちゃんとレイアウトされました。
ありがとうございます。

　　　 ＿＿_
　　　／|∧_∧|
　　　||. (　　　 | じゃ、そういうことで
　　　||oと.　 　|
　　　||　|（__）Ｊ|
　　　||／彡￣ ｶﾞﾁｬ

同じIDを何回も使っているのはいいんですか？
この場合、副題内容日付って、クラスのほうがよくないんですか？

>>765
同じIDが別ページなら問題ない。同ページは駄目
下の行は日本語でおＫ

cssを使って擬似フレームを作っています。
フレームの外(メニューやヘッダー等)と内(コンテンツ)で2つのcssを書きました。
コンテンツの外枠としてボーダーをひきたいのですが、内の方にボーダー要素を書いてもブラウザで表示されません。
で、外のほうに書くとブラウザで表示されます。
ですがその場合、内の方と要素が被るために内の方の内容が読み込まれません。
外のcssを全部共通にして、内のcssだけをページ数分用意する形にしたいのですが、これを解決するためにはどうすればいいでしょうか？

被ったって読み込まれないなんてことはない
擬似フレームじゃない何をやってるんだ
その症状が出る最低限のhtmlとcssを持って出直してこい、最低限だぞ

>>767
なにを言いたいのか分からんけど、メニュー部分とコンテンツ部分のcssを分けたいんなら、外部スタイルシートでmenu.cssとcontents.cssを創って一緒に読み込めばいいんじゃない？

>>768
では、ボーダーが読み込まれないのは何故なんでしょうか？
最低限のHTMLとCSSをうｐしろってことですか？
>>769
そうしているのですが、読み込まれないというか、読み込んでるけど記述してあるはずのボーダーが表示されないというわけです。

オウム返しｗ

>>770
お前質問する土壌にも立ってないよ・・・

>>771-772
>>768の下2行の意味が分からないのですが、htmlとcssをここに書き込めといういみなのでしょうか？

>>773
最低限の構成でな
全部書いたら無視されるぞ

えーと、ちょっとまとめます。
frame.css、content1.css、content2.cssの三つのcssを用意しました。
1.htmlではframe.cssとcontent1.cssを、2.htmlではframe.cssとcontent2.cssをそれぞれ読み込むように記述しました。
ページはこのようなレイアウトです。
http://www2.vipper.org/vip1097002.gif
コンテンツの中身だけが切り替わるフレームページのようなページにしたいんです。

最低限と思われる部分だけ抜粋しました。
[html]
<head>
<meta http-equiv="Content-Style-Type" content="text/css">
<link href="css/frame.css" rel="stylesheet" type="text/css" media="all">
<link href="css/content1.css" rel="stylesheet" type="text/css" media="all">
<title></title>
</head>
<body>
<div id="wrapper">
<div id="head_foot"></div>
<div id="content"></div>
<div id="menu"></div>
</div>
</body>
</html>

[css(frame)]
*{list-style-type: none; margin: 0 auto; padding: 0 auto; text-align: center; margin-top: 10px; }
#wrapper{ position: relative; width: 932px; height: 592px; border: 1px solid; }
#head_foot{ float: left; width: 150px; height: 500px; margin: 0 0 0 5px;
}
#menu{ clear: both; width: 100%; }

[css(content1)]
#content{float: right; width: 750px; height: 500px; margin: 10px 10px 5px; border: 1px; overflow: scroll; }

全然最低限じゃない件

>>775
どこが擬似フレームだよ
まずそこから勉強し直せ

>>777
どれくらい省けばよかったんでしょうか？

>>778
こういうページは擬似フレームとは言わないのでしょうか？
2つ以上のhtmlを幅分けして表示するページがフレームページではないのでしょうか？
cssでフレームページのようなページを作るのが擬似フレームだというのは認識間違いでしょうか？

兎も角、コンテンツ部分のCSSが読み込まれないんです。

ソウデスカ
ttp://www.asahi-net.or.jp/~SD5A-UCD/rec-html401j/present/styles.html#h-14.3.2

>>776
×#content{float: right; width: 750px; height: 500px; margin: 10px 10px 5px; border: 1px; overflow: scroll; }

○#content{float: right; width: 750px; height: 500px; margin: 10px 10px 5px; border: 1px solid; overflow: auto; }

border: 1px;　って何がしたいの？

1.htmlと2.htmlとか言ってるんだから
何言っても無駄じゃね・・・

やってるの別ページかよ、そりゃ読み込まれるはずねえｗ
ちゃんと別ページの方でCSS読み込ませろよ、でFA

>>781
表示できないのですが。
>>782
修正してみましたが、スクロールバーが消えた以外に特に変わりないです。
>>783
囲いにボーダーがひきたいんです。
>>784
？
>>785
ちょっと意味が分からないのですが。

>>786
スレ違いというかもっと基礎の基礎から勉強してきてくれ
>>7

>>787
基礎の基礎とはどのようなことをいうのでしょうか？
基本的なことは分かってるつもりなのですが･･･。

特に>>785は意味が分からないのですが･･･。

あと、>>776は全部共通の部分で、ここに書き込むにふさわしいと思われる部分だけを抜粋しました。
もちろんコンテンツの中身は各ページ違いますし、コンテンツ用cssは各ページ分用意してますが、フレームページ用cssはひとつです。

釣りじゃねーのコレ…

>>790
断じて釣りではないです。
ですが、釣りに見えますね。
客観的に見て、僕は皆さんが至極当然に理解出来ている内容が理解出来てないように思います。
とりあえず、もう一度自分で1から考えてみます。レスありがとうございました。

はてしなく意味がわからないんだが、ひょっとしてやりたいことって
border: 1px;
↓
border: solid 1px #000;
だけだったりする？

俺が思うにサンプルになるページを誰か作って質問主に見せてやる方がいいような気がする。

そもそもやりたいことがわからないからサンプルも作ってやれない

質問者がやりたいことをまとめると
・フレームを使わずにフレームページを作りたい
・メニュー部分とコンテンツ部分の境界線を入れたい
・どのページに飛んでもメニュー部分は同じ構成にしたい

…でいいの？

つーか>>786で>>781が表示できなかったり>>782が変わりなかったりする時点で
そいつのブラウザがおかしくなってると思えるんだが

質問させてください

html
　<div></div>
css
　div { width: 10em; }

このようにソースを書いている場合、
div内に文字を流すと横幅が10emに達すると改行されますが、
たとえば、
文字列が20emある場合はdivが拡張して、あたかも
div { width: 20em; } のように見えるようにする最善の方法にはどんな方法が考えられるでしょうか？

widthを捨て、width以外を使うことで実現できるのでしたら、
その方法を選んでも構わない状態ですので、どうかよろしくお願いいたします

情報が不足しているように感じましたので補足します

普段はdivを
div { width: 10em; }
の幅で表示させておきたい状態です

div内に流す文字が10emを超える場合は、
cssで指定した上記のwidth縛りを破って
1行辺りの文字列の幅によっては、
divで囲んだ場所が20emにも30emにも横に膨らんで欲しいのです

white-space:nowrap;のことか？

>>799＋display:table-cell;のことではないか、多分

>>799
レス頂きましてありがとうございます

それではたとえば、

　div { width: 10em; white-space: nowrap; }

というので何か問題になりそうなことはありますでしょうか？

特に問題が無いようでしたら、
white-spaceを使ってみようと思います

>>800
display: table-cellを併用すれば実現できそうですね
IE6でもハックを使えば行けそうな情報がありました

レス頂きましてありがとうございました

>>801
普通に使ってみたらいいじゃんｗ

white-space: nowrap;はdivが膨らむっていうのとはちょっと違うよ。
文字がその領域からはみ出してしまうことになる。
背景色とかを指定ないなら問題ないと思うけど。

「div内に文字を流す」
こんな言い方って普通なの？
オレは初めて聞いたけど

>>803
お前何のために>>800があったと思ってるんだ、馬鹿か？

min-width ちゃうん？

　　┏━━━┓　┏━━━━┓　┏━━┓
×　┃ＣＳＳ┃→┃ＨＴＭＬ┃→┃出力┃
　　┗━━━┛　┗━━━━┛　┗━━┛
　　┏━━━━┓　┏━━━┓　┏━━┓
○　┃ＨＴＭＬ┃→┃ＣＳＳ┃→┃出力┃
　　┗━━━━┛　┗━━━┛　┗━━┛

今頃>>806は試しのソース作って恥ずかしさに悶えてるんだろうか

Ctrl + Fで出てくる文字列検索機能をページに埋め込むようなことって出来ますか？

ボタン押して文字列検索とかならjavascriptで出来るけど
「Ctrl+Fで検索してください」って書いた方がよかないか

スレタイ読め

text-align: centerにして
たまにセンター揃えにならないのはなぜ？

どっか間違えてるんだろ

そうか
ありがとう。

>>809
htmlとjsを組み合わせれはできる

どうでもいいイメージ的な画像なんだけど
divに普通に画像貼るのと背景画像にするのどっちでもいいの？

>>816
目的地に自動車で行くか自転車で行くかはたまた徒歩で行くかの違いのようなもん

>>816
どうでもいいなら背景にしとけ
imgで埋め込むのはその画像が文章の中で必要なときだけだ

>>816
その画像がコンテンツの一部ならimg
装飾目的なら背景画像
「どうでもいいイメージ的な画像」なら背景画像のほうがいいだろうな

しかしスレ違い

xhtml1.0 strictで制作してます
h1タグの右側にpタグを置いてるのですが
h1の文字が大きいので、pタグの文字が上に浮いてしまったように見えてしまいました
pを下揃えにしたいのですがhttp://2-laps.com/mt/2008/03/cssdiv.htmlを参考にしても実現できません
どなたか、pタグの文字を下に下ぞろえにしたいのですが

h1,p{float:left;}
p{
pisition:absolute;
bottom:0;
}

<div id="contents">
<h1>タイトル</h1>
<p>段落文字段落文字段落文字</p>
</div>

すいません途中で送信してしまいました
どなたかご教授お願いいたします

どうでもいいけど恥ずかしいからそれは使うな、「ご教示願います」だ。
「ご教授願います」でググると恥ずかしさで悶えられるぞ。

そして何をしたいのかいまいちわからないが
floatとpositionは併用できない

>>820
俺も初心者だから何が悪いのか良く分からんが
多分これでやりたいことは再現できるはず。

.oppai{
font-size:32px;
font-weight: bold;
}

.paiotu{
pisition:absolute;
bottom:0;
}

<div>
<span class="oppai">おっぱい</span>
<span class="paiotu">(　ﾟ∀ﾟ)o彡゜オッパイ！オッパイ！</span>
</div>

またおっぱい大好きのアンタか
自分も好きだけどな

>>823
今すごいことに気づいたがoがiになってたよ・・・ん？

いっぱいおっぱいはたくさんだｗ

>>822は「確信犯」って単語に反応しちゃうタイプ

>>827は話題に乗り遅れて恥をかくタイプ

<div id="contents">
<h1>タイトル</h1>
<p>段落文字段落文字段落文字</p>
</div>

div#contents {
width: 500px;
/*clearFixとか*/
}

div#contents h1 {
float: left;
margin: 0px;
width: 300px;
}

div#contents p {
margin: 24px 0px 0px 300px; /* ふつうにmarigin-topで調節 */
width: 200px;
}

これでいいんじゃね？

div#contents {
border: 1px solid #000000;
width: 500px;
}

div#contents h1 {
border: 1px solid #000000;
margin: 0px;
width: 300px;
}

div#contents p {
border: 1px solid #000000;
margin: -28px 0px 0px 300px;
width: 200px;
}

これでもいいな。
IEはしらん。

classとかidの名前めんどくさいけどどうすればいい？

ぐぐったらよく使われるclass名やid名が出てくる。
でも、あんまりおすすめしない。

書くのがめんどくさいなら、さらにめんどくさく、
body div div div ul li ul li {}
とかにしたらいい。

>>820
htmlに書き加える事になるけど。

<html>
<head>
<style type="text/css">
<!--
.kakomi div{
display:table-cell; }

* html div.kakomi div{
display:inline;
zoom:1; } /* IE 6用のハック */

*:first-child+html div.kakomi div{
display:inline;
zoom:1; } /* IE 7用のハック */
-->
</style>
</head>
<body>
<div class="kakomi">
<div>
<h1>ここは見出しです</h1>
</div>
<div>
<p>ここに本文。</p>
</div>
</div>
</body>
</html>

<html>にheight100%へのバグは既出ですか？ググったけどどこにもなかったんですが。。

<html> はcssの効く <body>の中じゃないから
<html> タグ自体がなかったことになってる

>>834-835
日本語でおＫ

>>836
オマエモナー

>>835=>>837だとしたらあまりにも恥ずかしいな

>>834
htmlにheight:100%としたなら効果なくて当然。それが仕様

>>835
body外のhead内要素にもCSSは効く、まあ実装はまちまちだけど

すいません日本語崩壊でｗ
正確に言うとcssで<html><body>にwidth:100%、height:100%って
普通にやってたら、<body>にyリピートしてる画像が途中で途切れるんすよね。

一応ソースさらします。
<html>
<head>
<style type="text/css">
<!--
body, html {
width: 100%;
　　　　height: 100%
margin: 0px;
padding: 0px;　}
html {
background: url(../img/hanagara.png) repeat center top;　}
body {
background: url(../img/tatetate.png) repeat-y center top;　}
#doc {
margin: 0px auto;
height: 1000px;
width: 900px;　}
</style>
</head>
<body>
<div id="doc">テスト</div>
</body>
</html>

>>840
それって、IE8やFirefoxで起きてIEでは起きない現象のヤツかな？

>>841
IE8はわからんですがIE7とFF3で、こうなっちゃいますね。
ただIE6は問題ないというｗｗ

で補足なんですが、
1、このソースで、bodyにだけ背景画像の指定をすると何故か途切れない。
2、同じくこのソースで<html>のheght:100%を外すとbodyの背景画像が途切れない。

まぁ2の方法でやれば問題ないんですが、釈然としないんですよね。。。

>>843
だから仕様だと何度・・・
パーセンテージは親要素に対する割合なんだからさ

正しくはちょっと違うんだが、まあほぼそれだな
ttp://www.mozilla.gr.jp/standards/webtips/webtips0032.html

>>844
仕様ですか。。。>>845さんのリンク先は理解できたのですが、
<html>にheight:100%とする場合に起きる、自分が書いた>>840における現象が
何故そうなるのか、理解できません。すいません頭悪くて。。m(__)m

よろしければ詳しく教えて下さい。

>>846
詳細
ttp://www.y-adagio.com/public/standards/tr_css2/visuren.html#containing-block
ttp://www.y-adagio.com/public/standards/tr_css2/visudet.html#the-height-property

body { min-height: 100%; }
* html body { height: 100%; }

>>847
分かりました！！viewportの事ですよね？
なるほど。ブラウザの表示領域が、そのまま影響するから途切れちゃうわけですね。
すげー納得しました。ありがとうございます！！

>>834
>>848

>>850
>>845

仕様は分かるが出来るんだが？ブラウザの仕様は理解してるか？

>>852
>仕様は分かるが出来るんだが？
日本語でおk

普通にわかる文章だろ

仕様は分かりましたが、実際はスクロールしても背景を途切れることなく表示することが可能です。
ブラウザの仕様は理解していらっしゃいますでしょうか？

>>853これでいいか？

別に文法厨ってわけじゃないけど、「〜だが」とかが同じ文中で二回出ると変だと思う人もいるんじゃない？

>>855
自分は<html>からheight:100%を外すことで解決させていますし、納得もしています。
>>848さんのやり方は<body>直下の子要素のdivを100%表示させたい時に使いたいと思います。

皆さん色々アドバイスありがとうございました！！

>>自分は<html>からheight:100%を外すことで解決させていますし、納得もしています。
理解してないじゃないか。>>845読んだのか・・・？

なんか勘違されてるみたいだから一応補足。仕様は詳しくないので他の方に任せます。
html { height: 100% }
body { min-height: 100%; }/*モダンブラウザ用*/
* html body { height: 100%; }/*IE6以下用*/

仕様についてはこちらで。
【ブラウザ】仕様についてはここで語れ【CSS】
http://pc11.2ch.net/test/read.cgi/hp/1234072392/

マニアックなブラウザ使ってる奴はアフィのパフォーマンス低いから
ie6・7とfirefox以外切り捨てていいと思うよ＾＾

そんな簡単に切り捨てられたらどんなに楽か・・ｗ
いまだにNN6対応とか言われる泣きたくなる。あとMacIE5。

ああ、やっと分かりました。駄目だな〜俺ｗ
height:100%外しでは解決できなかったですね。
>>848さんありがとうございました！！

このＣＰＵでＣＳＳできますか？
intel(R)Celeron(R) M CPU 430 @ 1.73GHz

出来ます

ワロタ

初心者的質問です。

a:hover {background-color:aqua;color:fuchsia;}

のようなスタイルをインラインでスタイル指定するにはどのようにすればいいのでしょうか？

http://www.toyfish.net/docs/WD-css-style-attr-20010305.ja.html

W3Cの翻訳でこんなのあったけど。でも実際やってみたらできないね。
<head>内でスタイル要素使うか、外部スタイル使うしかないかもね。

んー、こんな基本的なことと思ったけど出来ないんだ。
どうもありがとうございました。

名前欄間違えました。
>>869-=>>867

３カラムの場合
固定幅レイアウトがいいですか？　可変幅レイアウトがいいですか？

デザインと相談してください。

ヤフーのトップにある5つのタブのようなモノをCSSで作れますか？

作れます。
でも、CSSなんか使いません

>>871
可変はやめとけ
ワイドディスプレイから見ると香ばしいことになるぞ

>>871
3カラム自体が不便

>>873
CSSだけでは無理ですつーかヤフーまとっぷがタブになってない件

>>875
それはどう見ても全画面にしてるお前が香ばしいだけ

>>875
ありがとうございます。やめときますね

>>876
不便ですか？

876じゃないけど、俺はiGoogleみたいな３カラム可変は使いやすいと思う。
自分で調節できるのがいいかな。

解像度は1920x1200と1280x1024です。

下のテーブルで、<td colspan="2">にある「あ」を１つ増やすと、
「タイトル」の枠線の幅が100pxじゃなくなるんですが、
どうしてなんでしょうか？

使用ブラウザはIE7です。FireFoxでは起こりませんでした。

<table style="width: 500px; border: solid;">
　　<tr>
　　　　<th style="width:100px; border: solid;">タイトル</th>
　　　　<th>2007/12/31</th>
　　</tr>
　　<tr>
　　　　<td colspan="2">あああああああああああああ</td>
　　</tr>
</table>

>>880
携帯からだから実際にやってみてないけど…日付の<th>に幅指定してみたらいかがかしら？

IEはちょっと計算が苦手なおばかさんだから、
paddingとborderとwidthは一緒にいれないほうがいいかな。
th、tdはwidthを明示してあげるとIEも少しお利口さんになるぞぉ。

>>881
>>882
どうもありがとうございます。
日付の<th>に幅指定したら、うまくいきました。

CSSのロゴとかマークってありますか？

urlの()内のパスの書き方はどれがいいの？
１．background-image: url("images01.jpg");
２．background-image: url('images01.jpg');
３．background-image: url(images01.jpg);

865>>ありがとうございます。低スペだったんで不安でした。
それとビデオカードは高いんですか？

スレチだ死ねｸｿ

改行についての質問です
<br>の連続は正しくないらしいので、CSSでmargin-bottomを設定して<br><br><br>や<br><br><br><br>などの代わりにしているのですが
<div class="brbrbr"></div>
<br class="brbrbr">
これはどっちを使ったほうがいいのでしょうか？
divを使い過ぎてしまったら何か問題があるんじゃないかと不安です。

ごめんなさい。間違いに気づかず投稿してしまいました。
正確には改行についての質問では無いです。

>>884
ホームページに貼るボタンならあるよ。
http://www.w3.org/Style/CSS/Buttons/Menu

>>885
どれも正しいけど12はうごかない古いブラウザのことを考えるなら3

>>888
どっちも駄目
br自体を置き換えるんではなく、brの前後のブロックにmarginを付ける

CSS無視して、HTML初心者スレッドになってるな

>>891
つまり、
<p class="">ああ<br>ああ</p>もしくは、
<p style="margin:;">ああ<br>ああ</p>
のようにということで合っているでしょうか

>>893
なんでそこでbrを入れるんだ・・・
改行毎に段落ってのが日本語なんだから全部pでいい。
pを囲む意味段落としてdivでも入れればいいだろ

>>893
ttp://az-store.nrym.org/reproduce/mynotes/lecture/html-css/
ttp://members.jcom.home.ne.jp/pctips/www/MarkUp.html

>>894
すいません、ああ<br>ああは例文のつもりだったんですが、<p>の中に入れてはいけなかったんでしょうか…
>>895
ありがとうございます。そこで勉強させて頂きます。

連続brの解決法を探しても空タグやら画像やら、最後の手段みたいなものしか挙げられていなかったんです。
もう一度一から勉強し直します。

>>891ありがとう
CSS講座のサイトによって記述がバラバラだったので
どれがいいのか迷っていました

<html>
<head>
</head>
<body>
<div id="box">
<div id="box_inner">
</div>
</div>
</body>
</html>

body直下のdiv（id="box"）を高さ100%にする方法はわかるのですが
子のdiv（id="box_inner"）もあわせて高さ100%にするにはどうしたらいいんでげしょう？
おねがいします。

html,body {height:100%;}
としているなら

<div id="box">
<div id="box_inner">
の両方にheight:100%でなるんじゃね？

>>899
返答ありがとうございます
申し訳ありません本当に聞きたかったことではありませんでした
フッターを下部固定にしているんですが、
その上で入れ子になっているいくつかのブロック要素をheight100%にしようと試行錯誤しているんですが、
フッター下部固定の設定が影響してしまってうまくいかなかったんです。
もう少し試してみて考えがまとまったらもう一度質問させていただきます。
ありがとうございました。

後だし詐欺すんな

>>896
いれていいけど、改行はブラウザに任せてbr要素は不要だろ、ってことだと思うよ。
実際どんな幅で見てるかわからんしね

もう一度詐欺ｗ
最近、同じ奴ばっか質問してるだろ。
少しは自分で調べれ。

htmlにスタイル指定する奴は池沼

headにwidth指定するようなものｗ

HTAにするとは一つにまとめるんだけどな・・・

brは使ってもいいと思うけどね

>>888
もう見てないかな
例えば

<p>ここが1つ目の段落です</p>
<p>ここが2つ目の段落です</p>
<p>ここが3つ目の段落です</p>

こうHTML書いておいたとして

p { margin-bottom: 20px; }
こうCSS書けばそれぞれの段落の下に20pxの隙間が空く
基本的な考え方はこれ。
実際は<p>はデフォで+1行分自動で改行が入るから、こういう使い方をするなら事前にマージンのリセット等が必要かな
* { margin: 0px; }
とかね

1段落目の下だけに2行分の隙間をあけるなら
<p class="danraku1">ここが1つ目の段落です</p>
<p>ここが2つ目の段落です</p>
<p>ここが3つ目の段落です</p>
HTML
こう書いてCSSを
.danraku1 { margin-bottom: 2em; }
こうとか

ばあいによってはpの代わりにdiv使ったり・・・


暇ってイカンな・・・

本当にな
暇ならチラシで鶴折っとけ

ていうかそんなclassの使い方教えんなよ・・・

>>909
すんません・・
適当になんとなく書いちゃった

こういうのを表現するのに基本的にはどうやるべき？
888が言うようなbrの連続っつーか、段落間のマージンをその都度、好きにとるっての

HTMLからデザインの要素を排除して、デザイン的な要素はCSSで指定しましょうね、
っていうのがCSSの発端（なのかどうかは知りませんが）。

だからID、CLASSの命名がデザイン的要素なのはどうだろう？っていう考えなんだが、
ぶっちゃけ大規模サイトになるとそんなこといちいち考えてられません＼(^o^)／

テンプレート箇所とトップページだけ意味付けの命名ができてればいいよ。

表示に問題なければ他はどうでもいいんです

>>909=911であってる？
907はclassの名づけ方がオカシイってことだった？それとも隙間（マージン）を空ける手段が間違ってるってことだった？
909で手段を間違えてるって指摘されたのかと思ったんだけど
911見たら命名方がオカシイって言ってたのかな？て思って

命名に関してはちょっと907で適当に書いたけど、つまり右に寄せるコンテンツに
.right-box
とかつけたらイカンだろ！ってことだよね？後にやっぱり左に配置してくださいってなった時に.right-boxを左に・・・ってこんがらがるし・・みたいな

あと、手段としては一般的には他にどんな方法がある？

911は単体なのです。909ではないのです。

>>.right-box
俺の言いたいことは>>912でも言われてるからおｋなんだぜ。

でもハイフン、アンダーバーは使わないな。
そういう書き方なら.rBoxとかにするかも。

>>914
了解しました。

改めてみなさんに質問

ここが1つ目の段落です。
ここが2つ目の段落です。
ここが3つ目の段落です。
ここが4つ目の段落です。

これの
1つ目の下は10px
2つ目の下は20px
3つ目の下は30px
4つ目の下は0px
それぞれマージンをとりたい

これを表現するのに一番適切なのはどういう方法？
※divでくくったコンテンツの中の文章4段落と考えてください。

pのマージン変えたクラスつくりゃすむ話

>>916
907でいいってこと？

あんま深く考えないでいいよ。
>>912が全て。その先は個人の自由。

超ド素人です。ＨＰ制作歴１０秒ほどです。下らない質問ですけど許してください。

CSSファイルの中にコメントを残そうと思ったんですけど、適当なところに<!-- -->とやると誤作動を起こすようですね。

どのようにすれば誤作動の起きないコメントになるのでしょうか。

>>919
ＨＰ制作歴１０秒ほどでそんな質問が出てくる天才には、
恐れ多くてお答えできません。
きっと我々が答える前に解答を見つけているでしょう。

いい加減なレスに見えて>>920が真理な件

ｸｿﾜﾛﾀｗｗｗｗｗ

>>919
お前ｗ

cssには/* あああ */←これだろ＾ｑ＾

br連続はともかく一つなら使っていいでしょ

>>810
909は上のリンクをはっ付けた奴です
上のよんでこい

>>824
使う意味のある場面がほとんどない、せいぜい
「〜〜〜〜〜」
と言った。
程度

>>924
はげどう

XHTMLは文章構造を記述する言語だから
<br />は改行としてあり（連続じゃなければ）だと思うけど

>>926
文書構造として改行だけというのは基本的に存在しない
改行を必要とする一フレーズはpでおＫ
ていうかstrictスレ行ってギタギタにされてこい

数百ページもあるような大規模サイトのコーディングでもっとも求められるのはわかりやすさ
htmlの定義だのcssの定義だのうんちくたれるアフォは個人事業主にでもなってひとりでやってろ

>>927
段落と改行の区別がつかない人がいるのはこのスレですか？

>>927HTMLだのなんだの言う前に国語の勉強からするべき。

ストリクト的に言えばｐは段落であり
段落間の空間はマージンであけるべきってことじゃないの？

段落であればそれでいいだろうな。
改行＝段落と思ってるようなら考え直したほうがいい。

段落以外で改行なんて普通の文章には存在しないはずなんだよ

strictなお話なら、ちゃんと該当スレでやれよ。
http://pc11.2ch.net/test/read.cgi/hp/1208023080/

>>929
別物だからこそ改行は必要ないということだ
必要あると思ってるのはデザイン（笑）目的であってそれだったら初めからbr連発だろうと変わらない

>>928
プロが来てたら恥ずかしいよ・・・

>>935
国語の教科書持ってたら開いてみろよ。
段落でもないのに改行使ってるから。

お前が正しいというのであれば、
brがいつまでたっても非推奨にならないのはなんでかね。

小説とかは別に決まってんだろｗ

文書構造に他も糞もあるかよｗ
いいからきっちり説明しろよ＾＾

<p>あああああ</p>
<br />
<p>えええええ</p>

まさかこんなアホな書き方する人いないよね

>>939
もう一度過去ログを良く読むんだ。
文章中の改行の話なんだぜ。

<p>
あああああ
<br />
<br />
えええええ
</p>

まさかこんなアホな書き方する人いないよね

補足しておく。

<p>あいうえお<br />かきくけこ</p>
↓↓
<p>あいうえお</p>
<p>かきくけこ</p>

この例だと明らかに後者なのは明白だけど、
前者も文章の構造としてはいくらでもあるんだよね。

>>926の発言がきっかけなのになんで>>939や>>941みたいのが沸くんだろう。

元々横書きの英語のしかも論文のためにあるHTMLに例外が出るのは当然だろあほ

>>936
pは段落じゃなくて1フレーズだと何度言われれば理解するんだ？
brなんか使わずにpでおＫ

>>936>>945
l要素でも調べてこい

>>945オリジナル要素わろた

お前らいい加減すれ違いなんだからどっかいけよ

>>947
>>947
>>947

>>949
いや、フレーズのスペルが頭文字Pなんだｗ

画像置換ってしますか？
img要素でいいじゃないかとよく聞くのですけど。

本来文字だけでいいものを、装飾するという理由で画像にするというのも変じゃないですか？
その画像には文書構造に必要でないものが含まれるわけですし。

装飾だったら、やっぱりCSSでするべきなんじゃないかなと。
CSS有効、画像無効とかで見れないとかあったりしますけど。

そこらへんどうなんでしょうか。

>>950
誰もスペルの頭文字の話なんかしてないだろ

>>951
装飾ならcssでいいですよ

装飾目的なら基本背景。
印刷で出したいならimgで配置してaltなし。

>>952
人の言ってる意味が分からないから就職できないんだぜ！

>>953
印刷も関係ない
文書としてその画像に意味があるかどうかだけ

>>954
自分がわかってなかったのを棚に上げて就職できない憂さ晴らしか

あ、大事なことを書き忘れてました。

見出しとかでよくテキストを画像にするじゃないですか。
それを画像置換でするか、img要素でするかです。

リニューアルの時にめんどいので背景

>>945
>>950
>>947
これで分からないとか相当頭が弱いのか？

CSS有効、画像無効で見られるようにしときたければ文字も消さずに入れとけ

>>959
ｵﾏｴｶﾞﾅｰ
スレ違いだと何度言われても理解できないバカ

反論できないからって逃げるなよ＾＾
ちなみにスレ違い書いたの俺自身なので、お前も消えろ。

>>959
フレーズでpだなんてギャグ効いてるう！と言いたかったのかもしれないが
あいにく>>945はそういう意味で言ったんじゃない
パラグラフは日本語の改行ではなく数式１行等も包括する

いつもの奴だったか
真面目に書いて損した

なんでもいいからスレ違いで次スレ待て

>>963
理解してくれてありがとう。

>パラグラフは日本語の改行ではなく数式１行等も包括する
なるほど、paragraphって1行って意味もあったのか。

>>966
お前がスレ違いだと理解しろポナ

相手すんな同類。

散々相手して反論してスレ違いも糞もねぇだろｗ

>>959
頭弱いのはお前だろ
誰もスペルの話もしてなきゃ頭文字の話もしてなかったじゃんｗｗｗ
勝手に先走って上手いこと言ったつもりになってただけだろ

>>968-970
相手してるのと追い出したがってるのは別だ
お前らとっとと消えろ

>>970
次スレよろ

>>955
よく「印刷で出したいんですぅう」ってクライアントに言われるよ。
文書的に意味のない画像は〜って説明しても「それでも出して！」としか言わないからなぁ・・・。

プロがこんなとこ来んなよ・・・
それより>>970いないなら行ってくるが

>>953も>>973もポナだから相手するな

だってここ面白いんだもんｗ
>>970は逃げたかな？

そして全員がweb先生から逃げた

<p></p>のｐはパラグラフのｐ、
フレーズ記述として使うのは勝手だけど
改行に使うのはチガウヨ


で次スレ建てようか。

むしろ改行に使うのがチガウよ

あ、<br>を改行に使うのが間違いって意味ね
どうせ>>978も先生なんだろうけどさ

パラグラフにもならない改行はpreでやってろボケ

次スレ
http://pc11.2ch.net/test/read.cgi/hp/1223039289/

ごめん。まちがえた


次スレ
http://pc11.2ch.net/test/read.cgi/hp/1234355194/l50

<div class="left">a</div>
<div class="left">a</div>
<div class="left">a</div>
<div class="left">a</div>
<div>under</div>
で、
leftにfloat : left;
を指定しています。
こうすると、これらの4つの「a」と「under」が、5つ横に並ぶのですが、
「under」は4つの「a」の下に配置させたいです。
そこで、<div style="float: none;">under</div>
としたのですが、これでも同じように5つとも横に並んでしまいます。
そこで、
<div class="left">a</div>
<div class="left">a</div>
<div class="left">a</div>
<div class="left" style="float: none;">a</div>
<div>under</div>
としてみましたが、今度は「a」3つが横に並び、4つ目の「a」と「under」がその下に配置されてしまいます。

どうすればいいでしょうか。

視覚的にあらわすと、
[a] [a] [a] [a]
[under]
このようにしたいです。
<br />などは出来れば使いたくないと思っています。

clear:left

br使うななんて言ったら絶対アホだと思われる。

>>984
clear

>>986
お前と思われなければアホじゃないから安心だ

>>987は>>986が見えてるのに>>985が見えない本当のうましかです。

<br clear="all" />
を書いてみたら出来ました。
ありがとうございました!

>>989
CSSプロパティのclear

>>988
ポナ失せろ

>>988
おまえなんかいつも同じことしか書いてないのに見てもらえるのに何言ってんだ？

>>991
すみません、感謝してます。

うぜーな、先生も奴に構ってる奴も消えろ

感謝しなくていいから二度とくんな

なんなんだこの流れ

タクトがまた来てんの？

うん


埋め

適切なスレに書かなかった>>888が元凶。
次いで、「もう見てないかな」とかいって蒸し返した暇人>>907の愚行。

うめ

1000

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