タグ

cssに関するTori4のブックマーク (10)

  • CSSでレイアウトするなら絶対覚えておきたいブロックレベル要素のクセとかいろいろ

    Webデザインをするときに、必ず使うスタイルシート。思うようなレイアウトを作るために、チェックしておきたいブロックレベル要素や、インライン要素のクセみたいなのをまとめてみました。後半はスタイルが反映されない原因のひとつ、スタイルの優先順位についてです。 Attention 記事公開時からいろいろと勉強して、この記事内で紹介している事柄で、間違った解釈をしていたなーと気がつきました。 この記事の中でいくつか追記してありますが、詳しくは、新しく書いた 11月7日の記事:CSSでレイアウトするなら絶対覚えておきたい配置のルール:フロートや絶対配置、z-index とかいろいろ を読んでみてくださいね! New Post Webサイトをデザイン、レイアウトするのに欠かせないのが CSS(Cascading Style Sheets、スタイルシート)ですね!今では CSS3 が話題を集めていて、CS

    Tori4
    Tori4 2011/06/17
    よい確認になる。ブロック要素のpadding-bottom,padding-topの相殺や、優先順位など細かいこともまとめてあってよい!
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
    Tori4
    Tori4 2011/06/17
    cssの添削ツール
  • CSSセレクタ20個のおさらい

    CSSセレクタって意外と分かっていなかったりするので勉強ついでにまとめてみました。比較的実用的かなと思うものを20個紹介していきます。いい復習になればと思います。 CSSセレクタはスタイルを適用する対象を指定するものです。普段何気なく使っているclassやidなどもセレクタの1つです。 属性や要素といった堅苦しい用語が出てきますので図で簡単に説明します。 私のように基礎から勉強していないと、要素や属性と聞いてもピンときませんが、知ってみるとなんてことはないですね。 また、IEが対応しきれていないCSS3のセレクタもありますが、IE6~8でもCSS3セレクタが利用できるツールの決定版「Selectivizr」 で紹介したようにCSS3セレクタはie対策も容易なのでぜひお試しください。 SelectivizrはCSSを外部ファイルで指定した方がいいのですが、今回のサンプルはCSSを外部ファイル

    CSSセレクタ20個のおさらい
    Tori4
    Tori4 2011/06/16
    セレクタ20個、すごい使える!
  • レイアウト作りを簡単にしてくれるCSSグリッドシステム

    CSS でのレイアウト、段組み作りがとっても簡単にできる、CSS グリッドシステムをご紹介。既に使っている人もたくさんいるとは思いますが、未体験の人はぜひ試してみてくださいね! Web デザインに欠かせない、CSS でのレイアウト作り。コンテナ作って、ここにラッパー作って、メインが 600px で padding が 20px だから、サイドバーが、えーと … なんてことになりがちです。そんな面倒な作業がイヤだなーという人におすすめなのが、CSSグリッドシステム。全ての Web デザインに使える訳ではありませんが、結構重宝します。すでに使っている人もたくさんいると思いますが、こんな方法もあるんだよーということでご紹介します。 1. CSSグリッドシステムとは? CSS グリッドシステムというのは、レイアウトを均等に分けて、マス目上に考えるレイアウト。何が便利かっていうと、この段は4等分にし

    Tori4
    Tori4 2011/06/14
    CSSグリッドシステム
  • Firefoxのバージョン別CSSハック一覧表|web bibo

    /* CSS(スタイルシート)に関する知識・テクニックなどの備忘録 */ 文字サイズ 大 中 小 現在のページ: HOME » CSSハック・条件分岐 » Firefoxのバージョン別CSSハック一覧表

  • caraldo.net - it転職 リソースおよび情報

    caraldo.net は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、caraldo.netが全てとなります。あなたがお探しの内容が見つかることを願っています!

    Tori4
    Tori4 2009/02/25
    ブロック要素の高さ揃える
  • [CSS]スタイルシートの装飾のみでデザインしたタイポグラフィ集

    Patrick Burtのエントリーから、スタイルシートの装飾のみでデザインした8つのロゴデザインを紹介します。 <textarea name="code" class="html" cols="60" rows="5"> <span style=”color:#000000; letter-spacing:-2px; font:26px/28px Georgia, “Times New Roman”, Times, serif;”>patrick</span><span style=”color:#ff0000; letter-spacing:-2px; font:26px/28px Georgia, “Times New Roman”, Times, serif;”>burt</span> </textarea>

  • 2008年、ウェブのデザイナー・開発者がおさえておきたいリソース集 | コリス

    2008年、ウェブのデザイナー・開発者がおさえておきたいデザイン、Photoshop&Illustratorのチュートリアル、ブラシやベクター素材、JavaScriptCSSWordPress、タイポグラフィ、フォント、素材、リソースなどをnoupeのエントリーから紹介します。 2008 Most Popular Design posts, Tutorials and Resources デザイン関連 Photoshopのチュートリアル関連 Illustratorのチュートリアル関連 Photoshop&Illustratorのブラシやベクター素材 JavaScript関連 WordPress関連 CSS関連 フォント&タイポグラフィ関連 ツール&素材関連 デザイン関連 42 Awesome Business Card Designs 20 Beautiful HDR Pictures

  • dfltweb1.onamae.com – このドメインはお名前.comで取得されています。

    このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日のドメイン登録業者(レジストラ)(「ICANNがレジストラとして認定した企業」一覧(InterNIC提供)内に「Japan」の記載があるもの)を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年10月時点の調査。

  • 作業効率を高めるDreamweaverの小技---目次:ITpro

    制作会社に身を置きながら、テクニカルライターとして執筆をしている筆者が,リファレンスやチュートリアルなどの執筆を通して細かい機能を探る中でひらめいた,「日々の作業効率を高めるDreamweaverの小技」をご紹介します。 ・第1回 ひきついだサイトはdivでいっぱい! ・第2回 特定の要素(タグ)を削除したい ・第3回 マークアップの高速化について考える(1) ・第4回 マークアップの高速化について考える(2) ・第5回 環境設定を見直そう(1) ・第6回 環境設定を見直そう(2) ・第7回 環境設定を見直そう(3) ・第8回 Office書類の活用 ・第9回 Dreamweaver CS3は使えるのか?

    作業効率を高めるDreamweaverの小技---目次:ITpro
  • 1