【それでもCSSは破綻する】 CSSの設計手法と書き方を考える - QiitaRegister as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back useful informationWhat you can do with signing up
無駄なdiv要素やclassだらけのマークアップから卒業する方法
グリッドベースのレイアウトを作成すると、ついついdiv要素を多用してしまいがちですが、意味のあるデータにはそれに適した要素を使用し、無駄なdiv要素やclassだらけのマークアップから卒業する方法をWebdesigner Depotから紹介します。 Fight Div-itis and Class-itis With the 960 Grid System 下記は各ポイントを意訳したものです。 はじめに CSSのフレームワーク：960.gsの場合 classの乱用を避ける リスト要素の使用 画像とキャプションの使用 複数の見出しとパラグラフの使用 子要素のclassは親要素に はじめに 数年前までウェブページの設計はテーブルがスタンダードでした。そしてCSSはそれを大きく変え、今日ではCSSのフレームワークがウェブページの設計を容易にしてくれています。 しかしながら、このCSSのフレームワ
「リセット用CSSを使わない」ことが流行ってる（らしい）理由 | necoze LOG2 [ネコゼログログ]
一定期間更新がないため広告を表示しています
![「リセット用CSSを使わない」ことが流行ってる（らしい）理由 | necoze LOG2 [ネコゼログログ]](https://cdn-ak-scissors.b.st-hatena.com/image/square/2302e44c95c7e474fefb218540004f95dc47a4bb/height=288;version=1;width=512/https%3A%2F%2Fimaging.jugem.jp%2Ftemplate%2Fimg%2Fjugem_og-image.png)
CSSでDivを天地左右中央に配置する方法『locate div at the center vertically and horizontally』 | CREAMU
DiaryTechnology CSSでDivを天地左右中央に配置する方法『locate div at the center vertically and horizontally』 ちょっと実装したくなったので、CSSでDivを天地左右中央に配置してみました。 Web creatorsに載っていた方法ですw。 » Web creators (ウェブクリエイターズ) 2007年 03月号 ■CSSは↓。 <style type="text/css"> body { background:#ccc; margin:0; padding:0; } #wrap { position:absolute; width:500px; height:100px; left:50%; top:50%; margin-left:-250px; margin-top:-50px; background:#ff
Blogサイトで見かける変なHTML - 3ping.org
というキャッチーな見出しを付けてみたけれど、(X)HTML(以下HTML)なんてのは自由に書いて、伝えたい人たちに思っている事が伝わるならば、それでいーんです。と、最初に言っておくよ。 自分の作ったWEBページのメンテナンス性を上げたいと考える人や、ソースコードを簡潔にしてダイエットしたいと思う人も中にはいるでしょう。複雑なBlogツールのテンプレートソースに四苦八苦してる人、単にW3Cの仕様に準拠させたページを作りたいと思ってる人も多いかもしれない(それは素晴らしいことだよ！)。 コンテンツの利用価値を高めたいと思っている人達、そういった方へ向けて、僕がよく見かける「もっといい方法があるよ」と思えるHTMLの記述を、代替ソースとセットで書いていきます。 項目をa要素やbrを使って整形する リストをリンクのためのA要素でマークアップして並べるという、ブログのメニュー部分などでよく見られる
lockエラー | 月額200円からのレンタルサーバー JSN
まずは最近知って便利だと思ったCSSの小技をひとつ。 文章の最後に、「※（米印）」などで注釈を入れたいときに、CSSのみで行の開始位置を揃えるのにすごくシンプルなやり方がこれ。 .note { padding-left:1em; text-indent:-1em; } <p class=”note”>※米印を使う場合はこいつが便利。<br /> 改行してもこの通り。ちゃんと開始位置が揃ってる。</p> 「padding-left : 1em;」でまず１文字分右に動かして、「text-indent : -1em;」で最初の行だけ１文字分左に出す、ということらしいです。これ考えた人はえらいっすねぇ。 他には開始位置を揃えるいわゆる「ぶら下げ」をCSSでやる場合、<div>タグの入れ子を使ってもいいが、<dl><dt><dd>の定義型リストを使うのがおすすめ。Definition Listの略で
CSS ハックまとめ Lucky bag::blog: IE7 を含むモダンブラウザ向け
Internet Explorer 7 は、 8 月にも beta3 がリリースされるかも知れないんだけど、今現在、IE7 beta2 を含むモダンブラウザに有効そうだと思われる CSS ハックを自分用にまとめておく。以前に IE 7 用の CSS ハックを紹介したことがあったけど、今回の Easy CSS hacks for IE7 - Nano See, Nano Do で紹介されていたハックは、比較的シンプルかも知れない。想定ブラウザは下記のとおり。 バージョン 6 以下の IE IE7 それ以外のモダンブラウザ（Safari、Opera、Firefox） ブラウザごとのハック 全てのサンプルは body 要素を指定の対象としている。 バージョン 6 以下の IE にのみ適用 * html body サンプルページ バージョン 7 の IE にのみ適用 *+html body サンプ
あなたは勘違いしてないか？ 真相究明！ CSS都市伝説 | Web担当者Forum
あなたは勘違いしてないか？ 真相究明！ CSS都市伝説 ウェブ制作の現場を襲う大きな変化 CSSの真の姿で巷に流れる誤解を解く！ 書店のウェブ関連コーナーに圧倒的な物量で並ぶCSS関連の書籍。ウェブ制作の現場でもCSSがトレンドになりつつあり、現場は大きく変化し始めている。では、ウェブマスターにとってCSSを採用することのメリットとはなにか。また、こうした変化の最中には、数々の「都市伝説」なるものが生まれてきているようだ。ここではCSSの正体と都市伝説について検証する。 森川眞行（シリコンカフェ）＋CreatorsNet CSSとは「表現言語」CSS正式な名称はカスケーディング・スタイル・シート。シンプルにスタイルシートと呼ばれることもある。 ウェブページを作成する際に記述するHTMLとはウェブページを作成するための構造言語で、文書の骨格を作るためのものだ。これに対してCSSは表現言語とい
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「Yahoo!ニュース」の表示速度が3～5倍に、そのからくりは……：記事の芽
//// COLOURlovers :: loving colours since 1981