5ちゃんねる ★スマホ版★ ■掲示板に戻る■ 全部 1- 最新50  

■ このスレッドは過去ログ倉庫に格納されています

スタイルシートが使えない・・・・

1 :Name_Not_Found:02/05/10 19:24 ID:tribCnRy
いまいちその構造というか使い方ってのが直感的に理解できないです。
ビルダーソフトなんかがほとんどないころに手書きでHTMLをはじめ、
しばらくのブランクの後、WEB関連に戻ってきて、今はスクリプト書き(Perl)
がメインなんですが、CSSがとんとわかりません。スクリプト内のHTML部分は
非常に単純なものばかり。デザイン面とかを充実させる為にもCSSを使えるように
なりたい。皆さんどうやってモノにしてきましたか?

2 : :02/05/10 19:28 ID:WhCh4hx+
<head>〜</head>の間に、

<style type="text/css">
<!--指定したい部分{指定したいもの:その値}-->
</style>

をかます。

3 :Name_Not_Found:02/05/10 19:30 ID:MhOYxqi+
「項目」、コロン、「値」、セミコロン

4 ::02/05/10 19:32 ID:tribCnRy
早速のレスありがとうございます。結局
「HTMLタグを自分で再定義しなおす」
って考えていいんですかね?大雑把にいって

5 :Name_Not_Found:02/05/10 19:34 ID:MhOYxqi+
まずはdisplay:inline;とdisplay:block;の違いについて理解すべき。

6 ::02/05/10 19:44 ID:tribCnRy
>5
どういうことでしょう?
あと、皆さんにお聞きしたいのですが、
H1{color:green;}
とかって指定するわけじゃないですか?
またはIDとかClassで指定するみたいですけど、サイトを作り始める
前に設計(?)しとくんですか?それとも限りなくstrictに近いHTMLで
組んだ後にCSS使ってリデザインするんでしょうか?

7 :Name_Not_Found:02/05/10 19:54 ID:/I7bid1M
ウェブブラウザが独自の“スタイル”を持っているとして、
それを CSS で、【上書きしていく】と考えるとわかりやすいんじゃないかな。

例えば h1 要素は、
「大きく」「太く」というスタイルで、多くのブラウザは表示します。
それを、「真ん中寄せ」と「普通の太さ」というスタイルにしたければ、
------
h1 {
text-align : center;
font-weight : normal;
}
------
と、書くことになります。

>>5 さんの例を使えば、
ブロック要素で、「ブロックとして表示」スタイルを適用されている物に対しても、
------
h1 {
display : inline;
}
------
この記述でそのスタイルを上書きして、
「インラインとして表示」させることもできるわけです。

この際、“Strict”では無いまでもシンプルな HTML を書いていると、
作業をとてもかんたんにすることができます。
なるべく id class 無しの書き方をして、
必要に応じて(あらかじめわかってる場合はその都度)足していくと楽です。

……こんな説明でわかっていただけるでしょうか…。

8 ::02/05/10 20:05 ID:tribCnRy
なるほど、少しわかってきた気がします。
そもそもHTML書くのにブロック要素をあまり使わない癖がついてしまっているので
(たとえば<H1>を使わずfont sizeで文字サイズを変えてしまうとか)
その癖を直さないといけないですね・・・・
HTML辞典見直して構造化言語(?)としてのHTMLをもう一度理解しなおしてみます。
で、立てさせていただいたスレを無駄にするのも申し訳ないので、皆さんがCSS出現時
に戸惑ったり、苦労した話とかを聞かせていただけると、いろいろ参考になるかと・・・
「CSSなんていまさら」って感じなのかも知れませんが・・・

9 :Name_Not_Found:02/05/10 20:29 ID:jgiXBIsq
つーかさ、何で単発質問スレを立てるわけ?
総合スレに書き込めっての。ここは2chですから

10 ::02/05/10 20:38 ID:tribCnRy
すいませんでした。質問ってつもりは無かったんですが、CSSが出現したとき
皆さんどうやって対応してきたのかなぁ?と思って・・・
私の場合
HTML手書き>ブランク>>>>>>>ビルダーソフト多数出現
って感じだったんで、再開したときにはすっかり忘れていたHTMLをぜんぜん
思い出せなくてもとりあえずページを作れる状態になっていて、Javaスクリプト
とかCSSとかを意識することがありませんでした。でひょんなことからCGI/Perlを
作り出してから改めて手書きhtmlの必要性が出てきたんですが、いざ使うとなったら
CSSとかぜんぜんわからず・・・Javaスクリプトもぜんぜんわかりません。でもCGI作ってても
その辺わからないとデザイン、機能面でいい加減限界が来て、皆さんはどんな段階踏んでるのかな?
とか思ったもんで・・・・

無駄スレ立ててホントすいませんでした・・・・話が広がらないようならこのまま沈めてください。

11 :Name_Not_Found:02/05/10 20:40 ID:oxC2M8Dj
>>8
CSS 苦労話の筆頭と言えば、 UA 側のバグが非常に多いこと。
バグと仕様の見極めが初心者・入門者には非常に難しく、
スタイル指定言語なのに「表示して確認」があてにならない。

12 :Name_Not_Found:02/05/10 20:41 ID:/I7bid1M
>>9
もし HTML 主体でのレイアウトをやってきた人が、
CSS 導入につまづくような事があるとしたら、
それを取り除くアドバイスをしてあげられたらと思うわけで。
話題が広げやすいテーマで、少なくとも俺には需要があるスレです。

13 ::02/05/10 20:53 ID:tribCnRy
>>11
やっぱりUAがネックなんですかね・・・・
てかHTMLにしたって相当独自拡張があるわけで、IEなんかは良くも悪くも
柔軟に解釈してくれるんでCGI書いててもForm周りで気づかないバグが
でまくってたことがありました。(最初のころは複数プラットフォームでの
チェックなんてやってなかったんで)
「表示して確認」って言えばDWのスタイルシート周りは「プレビューしないと確認できない」
ってのが多すぎて萎えますな・・何のためのビルダーアプリなんだか・・・

>12
援護射撃(?)ありがとうございます。ほんといい加減HTML主体のレイアウト
から抜け出したくて・・・


14 :Name_Not_Found:02/05/10 21:01 ID:+gwWV5Bn
http://pc.2ch.net/test/read.cgi/hp/1019881572/7
この辺ひと通り回ってみてはいかが。

自分はプロパティを片っ端から覚えるところから始めて、
ある程度判ってきたところでオールCSS(外部CSS)に移行、
それからセレクタの使い方を再認識し、(゚д゚)ウマー。
ちょうどその頃カスイケスレに晒され、リンク集に掲載。
最近になって仕様書を読むようになりました。

結局は「慣れ」です。

15 :Name_Not_Found:02/05/10 21:22 ID:LIufVcJo
初心者らしくページデザインの設計を真面目にやらず
だらだらビルダーで作ってたら<font>や<span>タグが異常に増殖。
cssならclass指定してヘッダにまとめて書けるので、軽量化にもイイ。

私はそんな感じであまり大した違いはないけど軽量化を目的に覚えました。
でもブラウザ非対応cssもかなりある罠(w

>>13
>DWのスタイルシート周りは「プレビューしないと確認できない」
ブラウザによっては非対応となるスタイルを書いたりすると
そんなことあると思いますが。

16 :Name_Not_Found:02/05/10 21:35 ID:4tnTu4F4
私はまず本を買って勉強しましたよ。
→「スタイルシート辞典」翔泳社

DW4までのスタイルシートの使い勝手は
いろんな部分で悪いです。MXで改善されたのかな?
ちなみにCSSエディタを使うならTopStyleがお勧め。
http://www.bradsoft.com/topstyle/

17 ::02/05/11 00:50 ID:11ZPaSkD
練習にと思って、手持ちのBBSのCGIの表示部分(テーブルでレイアウト)
でやってみたら、崩れる崩れる・・・
翔泳社の辞典片手に格闘中

18 :Name_Not_Found:02/05/11 02:06 ID:4zS9ahCN
別に信者ではないけど、やっぱりstrictなマークアップができるようにした方が良いよ。
漏れも最初はフロペでホムーペジ作ってて、CSS使おうと思ったのがつい最近。
でも1さんみたくサパーリ。そこで一からhtmlを覚えようとした。
そしたら何のその、基本的なCSSは結構簡単だ!
正しいマークアップにシートを掛けるみたいな。書き方とかプロパチィとかは
後から覚えても良いんでないか?TopStyle Liteでも使いなよ。
UAの対応状況も後回しでまずは基本を抑えようよ。

とか言ってる自分はdiv多用のナンチャッテCSSユーザー。スマソ。

19 :Name_Not_Found:02/05/11 05:06 ID:WCrXS8Tj
最初はここで勉強しました。
http://www.kanzaki.com/docs/html/htminfo17.html
翌日、スタイルシートの本を買ってきました。
手書きで書いたindex.htmlをCSS(外部)を使って書き直しました。
自分のサイトはどのページもレイアウトが統一されているので、
後は楽に再構成できました。
CSSは、作る側にとってはとても便利だと思います。

20 :Name_Not_Found:02/05/11 07:30 ID:GfV3GGA3
私も格闘しているので教えてください。
企業サイトがスタイルシートを使用する場合
ブラウザチエックしてリンク先を変えるかと思いますが
どの程度に分けていますか?

例えばブラウザをWIN、MAC、LIN、その他、に分け
それぞれIE、NN、分けて
さらにJavaScriptを考えると
適当な分け方に疑問を持っています。
企業サイトを製作する場合、その程度のことは
わかっているのが当然なのでしょうか?
宜しくお願いします。


21 :Name_Not_Found:02/05/11 08:37 ID:6fRC/MMP
http://pc.2ch.net/test/read.cgi/hp/1018719800/l50

ここ行け

22 :Name_Not_Found:02/05/11 14:57 ID:V0d3QI+5
私は最初はとほほの(略を見ながらひたすら作ってましたね。

23 :183=185:02/05/11 15:01 ID:2aZ8R797
>>22
とほほ->野崎のとほほ批判->仕様書の順番で学んだな。
結局本は一冊も買ってない。


24 : :02/05/11 15:42 ID:kNTv9rbZ
>>23
ここでは、本買わない事がカッコイイことなんか?

25 :Name_Not_Found:02/05/11 15:53 ID:V0d3QI+5
>>24
そうじゃなくて、本を買わなくてもやろうと思えばできるって言いたかったんだろうよ。


26 : :02/05/11 16:00 ID:w3MZW4Xh
人それぞれだね。
俺は結構買うけど。

27 :Name_Not_Found:02/05/11 16:40 ID:PWVq7SVp
仕様書とMSDNで十分

28 :Name_Not_Found:02/05/11 18:10 ID:LZe8gr5f
モニタ上のテキストってどうしても読みにくいもんね。
解説系のまとまった文章はたとえ何百ページあろうと
とにかくプリントアウトしないと読めない知り合いがいて
そういう奴は本にいくんだろうなーと思う。

29 :Name_Not_Found:02/05/11 22:07 ID:3t96puFO
俺も「とほほのスタイルシート入門」でした。
http://tohoho.wakusei.ne.jp/wwwcss.htm
何もデザイン考えずにHTML書き散らした物があったので、
ひとつひとつプロパティを拾いながら書き足しつつ覚えました。

そこで、逆に今覚えようとしている方に質問なのですが、
このリファレンスでわかりにくい部分はどこですか?

俺は、サンプルがどれも局地的にしかCSSが使われていない物なので、
全体をCSSでレイアウトするときの感覚がなかなかつかめないと思いました。

30 :Name_Not_Found:02/05/11 23:16 ID:ERoJAEo/
>>18にほぼ同意だなあ。
自分の場合もサイトを一度全部Strict(を目標とした)HTMLで
書き直して、元のデザインをCSSで再現することから始めたよ。
適当なHTML書いてた頃は結局テーブルレイアウトとかfont size
とかでいいじゃん、て発想になってしまってなかなかCSSが
身につかなかった。

結局テーブルに戻るんだよなんてスレがあった(今もある?)
けど、とっかかりとしてはちゃんとしたHTMLとCSSって
勉強の仕方が合ってる気がするな。

31 :かおりん祭り ◆KAORinK6 :02/05/12 00:19 ID:E39ng5II
〜oノハヽo〜 / ̄ ̄ ̄ ̄ ̄ ̄ ̄
  ( ^▽^) < 新スレおめでとうございまーす♪ 
= ⊂   )   \_______
= (__/"(__) トテテテ...



32 :Name_Not_Found:02/05/12 10:03 ID:k+PmXe/i
ところでidやclassの名前ってどうやって決めていますか?
今まで、思いつきで考えて好き勝手に決めてたんですが、
複数の人間が共同で作業する場合、困ることが増えてきました。

33 :Name_Not_Found:02/05/12 12:03 ID:A14jjwUI
>>32
命名パターンとよく使われそうな語の表記法を予め決めておく。そして途中で変えない。
ファイル名とか変数名のつけ方とかと同じ要領。

34 :Name_Not_Found:02/05/12 20:16 ID:fqIxxBz3
>>30
まだあるが、だいぶ生産的な議論が出たものの
一気に静まって今は死にスレに。

http://pc.2ch.net/test/read.cgi/hp/1011140326/

35 :Name_Not_Found:02/05/14 01:39 ID:SqCkf8VL
ぼくは他人のcssファイルをDLして憶えたよ。

すると多くのひとがどういう記述を多用してるのかがわかって
おもしろい。

body , td {
}
で全体のテキストを定義してるひとが多いみたい、とか。


13 KB
■ このスレッドは過去ログ倉庫に格納されています

★スマホ版★ 掲示板に戻る 全部 前100 次100 最新50

read.cgi ver 05.04.00 2017/10/04 Walang Kapalit ★
FOX ★ DSO(Dynamic Shared Object)