HTMLやCSSの知識は不要! 積み木感覚でレイアウトを組み立てるだけで、簡単にBootstrapのページ作成ができてしまうウェブサービスを紹介します。 ほんの数分で、今時のかっこいいページが本当に簡単にできちゃいます!
マウスオーバーでパネルがアニメーションでパタッと開き、中から現れるボタンを実装するスタイルシートのコンセプトを紹介します。
デモ:slide 3 [スペース]キーでスライドのオーバービューを表示。 [ad#ad-2] reveal.jsの主な特徴 reveal.jsは複数のパネルをダイナミックなスライドのアニメーションで表示することができます。 新しく改善されたスタイル。 下部にコントロールが可能なナビゲーション。 「highlight.js」を内包、コードのシンタックスハイライトに対応。 トランジションのテーマはdefault/concave/linearの3つ。 他のスライドをネストすることも可能。 各パネルごとに直接アクセスが可能。
Chandoo.orgのエントリーから、条件付き書式を利用して、エクセルのデータを見やすくする5つのテクニックを紹介します。 Learn Cool Microsoft Excel Conditional Formatting Tricks テーブルの横列・縦列をハイライト 条件付き書式を使用したガントチャート セル内に配置するグラフ ミスやエラー・データ欠落などのハイライト表示 直感的に把握できるデータテーブル [ad#ad-2] エクセルデータは、Chandoo.orgのエントリーの一番下からダウンロードできます。 テーブルの横列・縦列をハイライト テーブルのデータを見やすくするために、横列・縦列を交互にハイライト表示にします。 ハイライトにするテーブル全体を選択します。 メニューより、[書式] - [条件付き書式] を選択。 「数式」を選択し、「=MOD(ROW(),2)=0」を入力し
企業用サイト用をはじめ、コマース用、ポートフォリオ用、ブログ用などの高品質ながら無料で利用できるCSSベースのテンプレートを紹介します。 テンプレートは1ページだけのものから、配下ページなど複数のページが揃っているものもあります。 ※テンプレートは全て無料で利用が可能ですが、ライセンスを必ず確認してください。
ログインフォームを実装する際に、大切な7つの要素と重要な1つの機能を紹介します。 元記事では下記のCSS3で実装されたフォームもダウンロードできます。 フォームのタイトル このフォームが何についてのものであるか手短に説明されたタイトル。特に、ウェブサイトの名称を記すことは非常に重要です。 非メンバー用のリンク 非メンバーが偶然、このページを見つけてしまうことがあるかもしれません。そして、メンバーを増やすチャンスもあるので、登録ページへの誘導も行っておきます。 ラベルとフィールド ログインフォームは通常、2つのフィールドで構成されていますが、ラベルは読みやすいようにします。 パスワードを忘れた場合 これは同じく、非常に重要なリンクです。多くのユーザーは多数のアカウントとパスワードをもっているものです。そして、しばしばそれはあなたのサイトでどれなのか忘れてしまうことがあります。 また、配置する
<textarea name="code" class="css" cols="60" rows="5"> element { -moz-border-radius: 20px 20px 20px 20px; -webkit-border-radius: 20px 20px 20px 20px; padding: 20px; background: -moz-linear-gradient(center top, #999999 23%,#ffffff 93%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0.23, #999999),color-stop(0.93, #ffffff)); } </textarea>
ブラウザでさくさく確認できる、Unicodeの一覧表「Unicode table for you」を紹介します。
divで実装したパネルの四隅を1px欠けにして、角をすっきりみせるスタイルシートをonderhond.comから紹介します。
個人サイトでも商用サイトでも無料で利用ができるクリーンでシンプルなデザインのフリーのアイコンをIcojoyから紹介します。
使用するサイトのデザインにあわせて、カラーの変更が可能なフリーのアイコンがダウンロードできる「Iconza」を紹介します。 Iconza アイコンは、上記キャプチャのようにアイコンのカラーや背景のカラーを変更でき、サイズは32x32, 24x24, 16x16のものがあります。 アイコンは現在のところ90種類あり、ホーム、メール、RSS、検索、アローなど利用頻度の高いものがたくさん揃っています。 アイコンのキャプチャ(クリックで拡大) アイコンのダウンロードは、各アイコンをクリックすると個別にダウンロードでき、まとめてダウンロードする際は下部の「Download all icons」をクリックします。 アイコンは、PNG形式でした。 ライセンスは「Totally free.」となっているので、商用サイトでも利用可です。
社内のプロジェクト管理関連をグラフィカルにしたフリーのアイコン素材をSmashing Magazineから紹介します。
外部スタイルシートの指定は@importとlinkでどちらがいいかと、書籍「ハイパフォーマンスWebサイト ―高速サイトを実現する14のルール」の@importはパフォーマンスに悪影響を与えることについてのフォローアップを紹介します。 don't use @import 内容は、IEでは@importで外部スタイルシートを指定すると、パフォーマンスに悪影響を与えるので使用しないでください、というものです。 下記は、外部スタイルシートを@importとlinkを組み合わせて、それぞれのパフォーマンスを比較したもので、キャプチャはそのサイトのものと、参考に当環境でIE7/Fx3(XP)を検証したものです。 @import @import 2つの外部スタイルシートを@importで指定。 <textarea name="code" class="html" cols="60" rows="5">
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く