1 :
Name_Not_Found:
段組の数、リキッドか固定幅か、positionかfloatか、
と言うように、サイトを作る時のデザインは様々なものがあります。
そこで、CSSデザインの色々なテンプレートを作ってみるのがこのスレです。
できるだけStrictでValidなものにしましょう。
ブラウザごとのバグやSEO対策を施したテンプレなど、色々話しましょう。
削除依頼だしました
CSS3get!
海外のサイトは、固定幅の2段組がセンタリングされてるのが多い。
以上
5 :
Name_Not_Found:2005/03/25(金) 16:28:54 ID:3Til0uOV
作ってあげるだったらおもしろいのに、みるスレかよ
じゃあ今から
「CSSデザインのテンプレートを作ってあげるスレ」
にするらしいって聞いた。
「CSSデザインのテンプレートを作ってあげるスレ」もいいけど、
こんなのはどうだろうか?
・ネタ(依頼)がないときはみんなで好き勝手作ったものを晒し合う
・ネタ(依頼)が来たら適当に作ってあげる
・まとめサイトでも作ってデータベース化
>>8 そっちは「お題のHTMLにスタイルを適用させる」のが目的でしょ?
>>7の考えを取り入れたとしたら、「自分らで1からテンプレを作る」ってことになるだろ?
だからちょっと違うんじゃないかと思うが。
10 :
Name_Not_Found:2005/03/25(金) 22:45:28 ID:n0KyfBLw
>>10 Footerごと動くのが激しくうざいな
っていうかこの汚いソースはある意味反則技じゃないのか?
>>10 すげーどうやってるんだと思ったら
ボーダーかよ。背景画像使えないじゃん。
14 :
10:2005/03/25(金) 23:19:24 ID:n0KyfBLw
何のために position:relative を使ってるのかが分からんのだけど。
15 :
10:2005/03/25(金) 23:21:18 ID:???
>>13 ソースがわりと簡単で、どのカラムが最長になってもOKだから
ルール
フォントサイズ指定は相対固定に関わらず禁止ね。
後付ルールうざい。
フォントサイズ指定、幅固定は論外だろ。
期待age
失望sage
たかが角丸テーブルの為に、なんでこんなに苦労しないといけないんだろうな。
ネストしたり、空のタグ仕込んだり、不本意なのではないだろうか。
CSS3で解消されるのかな。
固定幅だと、角丸テーブルだとか、ボックスに関するデザインの自由度は広がるよね。
幅が決まってるわけだから、全部画像で作ることも出来るし。
その点、リキッドレイアウトはそれが出来ないのが難しい。
28 :
Name_Not_Found:2005/03/28(月) 14:28:35 ID:KQ8VhFDa
>>27 無駄なタグを入れなきゃいけないし、この例だとBタグ使ってるし、
あまり好きにはなれない。
>>24の言うように、固定幅なら上下のボックスの背景画像でなんとか出来るわけだが…
* NN4 には CSS を読み込ませない(定石)
* ブラウザのデフォルトスタイルを殺す(定石)
* /* 全指定 */
{margin:0; padding:0; font-size:100%; font-weight:normal; font-style:normal; text-decoration:none; color:#適当; background:transparent;}
* img 要素に vertical-align:bottom; と border:none; を指定(定石)
* line-height は数値のみを指定(定石/em や % で指定するのは問題の元)
* width を指定した要素に padding と border を指定しない(旧 IE と互換モードへの対策)
* height を指定した要素に padding と border を指定しない(旧 IE と互換モードへの対策)
* float を指定した要素に width を必ず指定する(文法規則)
* float を指定した要素に margin を指定しない(IE が2倍値で描画する)
* float で回り込む要素の内容が少ないとき、回り込む側にも float を指定するか、高さを指定(IE6 対策)
* float した要素の下に隙間を作りたい場合、float した要素に margin-bottom を指定+親要素に padding-bottom を指定(注:検証不十分)
* position:absolute; を指定した要素には margin を指定しない(注:検証不十分)
* position:absolute; を指定した要素にはなるべく width も指定する(定石)
* position:absolute; の基準として right と bottom は避ける(Opera6 を無視しない場合)
* position:relative; を多用しない(定石/たいていスクロールが重くなる)
* z-index を指定する要素には position プロパティで static 以外の値を指定(文法規則)
* マイナスの margin を指定した要素と背景画像を重ねない(IE で背景画像が切れる)
* background-attachment:fixed; を多用しない(定石/スクロールが重くなったり表示が乱れたり)
* overflow プロパティを使う場合 MacIE5 は諦める(特殊なケース以外では内容が消える)
とりあえずこれを入れとけ
32 :
Name_Not_Found:2005/04/03(日) 11:52:23 ID:4BfH2Qs8
33 :
Name_Not_Found:2005/04/29(金) 15:56:57 ID:RX7MvGbJ
どんな情報を提供するかによって、そのサイトの文書構造も違ってきます。
文書構造が違えば、当然CSSの設定も多種多様になるので、
CSSのテンプレートってあまり便利じゃないと思う。
ただ、個人的によく使っている設定はコレ。
@media print{
body{
font-family : serif;
font-size : 10.5pt;
}
.navi{
display : none;
}
}
ゴシック系フォント(IE,Operaのデフォルト)って紙媒体だとゴツくなるので
見出し以外は明朝体にしてます。
あと、「戻る」みたいなナビゲーション関係の情報は、紙媒体では必要ないので
その部分だけ印刷されないようにします。
※HTMLでは <div class="navi"><a href="./">戻る</a> と記述します。
ナヴィゲーションはlink要素でやれ! とHTMLヲタの漏れが来ましたよ。
35 :
33:2005/05/03(火) 01:18:41 ID:???
>>34 世の中にあるブラウザが、Opera7系やLynxだけだったらそれで良いんだけどね。
大手ブラウザが link要素のナビゲーション機能をサポートしてくれれば
是非とも、そうしたいところですよー
HTML文書の中で、述べたい情報以外の要素を配置しなければならないのは
正直うっとうしい。
36 :
34:2005/05/04(水) 13:49:51 ID:???
つーかOperaのUIは不十分だと思う。
ボタンにアイコンとか無くて分かりにくいし。
sage
sage
sage
sage
sage
sage
sage
今どのくらいできてるの?
45 :
Name_Not_Found:2006/09/20(水) 22:10:04 ID:HruhE9kR
作ってあげるスレはここですか?
http://www.geocities.jp/yama6313/ ロールオーバーリンクに挑戦しましたが、お手上げでした。
どなたかテンプレ作って頂けませんか?
ちなみに what's new のつづりは後で直しますので・・。
画像の一つのサイズは w97 h21 です。
時間がある方、こんなの余裕じゃんって方よろしくお願いします。
全部つなげてありますが分割したほうがいいのであればこちらでそうしますのでお願いします。
47 :
45:2006/09/21(木) 11:51:12 ID:???
他スレで聞いてきます。
sage
50 :
Name_Not_Found:2006/10/22(日) 09:19:25 ID:APMm9lDQ
─────────────────────
×
─────────────────────
/\ 警告
/ ┃ \ Webサイト所有者は
\ ・ / 早めにInternetExplorer 7での
\/ 表示の確認を!
─────────────────────
sage
sage
sage
55 :
Name_Not_Found:2007/09/15(土) 10:44:00 ID:09475SYv
>>53 そこのHTMLテンプレ一部変なタグがある気がする
戻りタグの指定とか。
一部じゃなくて大分変だが
それよりそこの問題は放置だ
>>53 <blockquote>
また、基礎HTMLはw3cで定められているHTMLの規格に完全には準拠していない。
このことは、使いやすさと文法の正確さの両立が難しいということも示している。
</blockquote>
どのへんが準拠してないの?
Another HTML-lintは何も言わないけど。
sage
sage
sage
62 :
Name_Not_Found:2008/06/06(金) 23:50:00 ID:AFjZG9io
過疎
64 :
Name_Not_Found:2009/07/01(水) 16:27:03 ID:J/n4JGck
65 :
Name_Not_Found:2009/07/07(火) 12:57:36 ID:25nLUITy
>>65 このレベルでweb制作会社の取締役とはw
上左右に分かれたフレームを使わないCSSで作成してほしいです
外部CSSファイルの使用を希望します
68 :
Name_Not_Found:2011/09/07(水) 22:57:50.52 ID:trvJ24YS
てs.
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね