[B! CSS] chiqashiのブックマーク

width:100%なのにはみ出す理由と回避策。CSSを触るなら必ず理解しなくてはいけないボックスモデルの話。（CSS おれおれ Advent Calendar 2012 – 05日目） | Ginpen.com

CSS おれおれ Advent Calendar 2012 – 05日目横幅いっぱいに広げようとしてwidth:100%を指定したら横スクロールバーが出ちゃった、という経験ありませんか？　その原因と仕組み、回避策についてお話しします。わりとFAQな感じ。これは是非覚えておいてもらいたいです。というか知っておいてください。はみ出した例 position:absoluteないしposition:fixedを使った際にこうなっちゃう事が多いと思います。上部から出てきたメッセージ欄、横にはみ出てますね。でも指定はちゃんとwidth:100%です。「幅いっぱい」を指定しているのに、どうしてはみ出てしまったんでしょうか。「幅」が意味するところ実はCSSの仕様が定めるところの「幅」というのが、我々が視覚的に認知している「幅」と異なっているのが原因です。 CSSではこんなものを定めています。

chiqashi 2012/12/16

css

リンク

段落の先頭1文字を別デザインに [ホームページ作成] All About

段落の先頭1文字を別デザインに雑誌などを読んでいると、段落の先頭1文字だけが大きな反転文字になっているデザインを見かけることがあります。これをホームページ上でも実現してみたいと思いませんか？スタイルシートを使えばとっても簡単です。段落の先頭の1文字だけを別デザインで書籍や雑誌を読んでいると、段落の先頭1文字だけが大きな文字になっているデザインを見かけることがあります。そのようなデザインをホームページ上でも実現してみたいと思いませんか？もちろん、先頭1文字を画像で作成するなどということはしません。画像を使っても実現できなくはありませんが、作るのに手間がかかるデザインの変更など、修正の必要ができたときに面倒段落先頭の単語が検索にヒットしない音声での読み上げ時に問題がありアクセシビリティが低下する …というような様々な問題点があります。そこでスタイルシートの出番です。スタ

chiqashi 2010/05/13

CSS

リンク

1ピクセルのずれも許せないWebデザイナのためにResetting Again | エンタープライズ | マイコミジャーナル

CSSがWebページデザインの主要技術になってから、WebデザイナはCSSの振る舞いに頭を抱えなかったことはない。もっとも悩ましいのは、同じCSSでもWebブラウザごとに表示が異なるところにある。なるべく同じ表示を実現しようと、一見すると奇っ怪にみえる設定を加えたり、意味がないような行を加えたり、背景色と同じ色の画像を調整用に追加したり、涙ぐましい努力は後を断たない。世界中のWebデザイナやフロントエンドデベロッパが同じ悩みを抱えているから、Webブラウザ間の互換性を実現するCSSライブラリがいくつも登場したり、ベストプラクティスをまとめたCSSリファレンスドキュメントが登場したり、CSS擬似クラスといったテクニックが紹介されたり、IEのCSS/HTML非準拠に対処するライブラリが登場するといったことが相次いで起こっているわけだ。しかし、ほかのライブラリに依存せずにいちから自力でCSS

chiqashi 2008/02/10

css
web

リンク

ブログテンプレート作成ツールで簡単ブログデザイン！ - CSSEZ

Cssez : ผลบอล บอลวันนี้ วิเคราะห์บอล ข่าวฟุตบอล เราคือผู้นำของเว็บดูผลบอลสดออนไลน์ ผลบอลสดภาษาไทย 7m ข่าวฟุตบอล สรุปผลบอล ไฮไลท์ ที่สามารถเช็คผลบอลทั่วโลก มีทั้งภาษาไทย Livescore 7m 888 ผลบอลมีเสียงวันนี้ล่าสุด พรุ่งนี้ หรือเมื่อคืน รวบรวมเว็บผลบอลต่างๆมากมายมารวมไว้ที่เดียวเช่น livescore.com 7m.cn 888scoreonline.com thscore.cc และ spbo.com รวมทั้งมีวิเคราะห์บอล ตารางบอล คะแนนบอล และดูบอลสดออนไลน์

chiqashi 2007/08/17