スタイルシートで作る「段組レイアウト」基礎クイズ スタイルシートで「段組(マルチカラム)」を作る方法について、基礎的な内容を5問のクイズにしてみました。 何も参照することなく全問正解できることを目指して頑張ってみて下さい。 (このクイズは、記事「JavaScriptで楽々! 採点機能付きクイズページを作る」でご紹介した方法で回答を保持し、最後のページで採点を行います。) Q1. 右図のような段組を作る際に必要なスタイルシートのプロパティとして、正しい組み合わせはどれ? float , clear , width float , width , height position , clear , width position , width , height ※「段A」と「段B」で2段組が構成されています。「フッタ」は段組に含まれていません。各段はそれぞれ、div要素1つで
Chris Casciano氏の選んだCSSティップス10選 Chris Casciano氏が「Ten Simple CSS Tips」という記事のなかで、知識レベルを問わずスタイルシートを書く誰にとっても便利であろう10のヒントを公開していました。個人的にナルホドと思った部分があったし、もしかすると参考になると思う人もいるかもしれないので、以下に訳文を晒しますね。原文はCreative Commonsライセンスでしたが、一応Chris本人から訳文掲載の許可も得ています。あーちなみに例によって英語は苦手なので(おい)、誤りとかあったら指摘してください>誰 スタイルを適用し始める前に、文法チェックによりマークアップを妥当なものにしましょう。 基本となるスタイルシートは* {margin:0; padding:0; }という規則集合で書き始め、(マージンやパディングは)それが必要な箇所に必要な
二日ほど前のブックマークの人気エントリーに入っていた、「AQUA風ボタンの作り方リンク集」を見てつくづく思ったのだが、Photoshopは奥が深く、同じような効果を作り出すのに何通りも方法があるのが興味深い。そこで、今日は、Photoshopにも関わらずあえて全てをベクターデータで書くという特殊な技法(知り合いのデザイナーから教わった技法)でAQUA風ボタンを描いてみた。 まず最初に、"Rounded Rectangle Tool"で適当な大きさの角の丸い四角を書く。角の丸みは、Radiusの値で変更できるが、この場合は16pxとした。 この時自動的に作られたレイヤーをダブルクリックして、レイヤースタイルのInner Glow属性をオンにする。Blend ModeはMultiplyで、Opacityは40%程度が適切、色は黒にする(黒にしておくと、後でメインの色を変更したときにここを変更し
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く