Bootstrapで最近人気の高いレイアウトやコンポーネントを簡単に実装できるテンプレートのまとめ
上部固定のScrollspy対応ナビゲーション、アニメーションがかっこいいオフキャンバスメニュー、ブラウザの高さいっぱい・半分に画像を配置、複数のコンテンツを配置するレスポンシブ対応のコンポーネントなど、最近よく見かける人気の高いレイアウトやコンポーネントを簡単に実装できるBootstrap用のテンプレートを紹介します。 Bootstrap 実装方法のほとんどは、Bootstrapの最小限の構成に数行のHTMLと外部スタイルシートを記述するだけです。 Bootstrapの基本的な使い方は、下記の記事を参考にどうぞ。 参考 Bootstrapのグリッドシステムの基本な使い方 BootstrapのベースのCSSを使ってさまざまな要素を実装してみよう！基本要素とナビゲーションのスタイル 以下のテンプレートはApache 2.0ライセンスで、個人でも商用でも無料で利用できます。 Scrolling
Private Presentation
Private content!This content has been marked as private by the uploader.
怒涛のサイトナビゲーション総まとめ！事例、チュートリアル、参考サイト、僕の知る何もかもを紹介！ | バンクーバーのうぇぶ屋
レスポンシブデザイン、パララックススクローリング、そういったレイアウトに関する変化に伴い、サイト内を誘導するナビゲーションの種類も多様化してきていますね。 元々、縦、横、ドロップダウン、固定、メガメニュー等、サイトの構造によって様々なナビゲーションを提案してきたわけですが、最近サイトのレイアウトを考える時、話に上がるナビゲーションの呼び方とか、種類とか、大量多量過ぎてもう分け分けらなくなってきたので、ちょっと僕自身の復習と、参考サイトやらチュートリアルやらないかを全部まとめてしまいたかったので、僕と、僕の周りのデザイナーさん達の役にたてるよう、今回記事にさせてもらうことにしました！ 実際にWEB制作に携わる中で、聞いたことのある物を分類させて頂くので、僕の勝手な分け方になってしまい申し訳ない限りなんですが、何かナビゲーションやレイアウトに悩んだ時にでも参考か何かにしていただければ嬉しい限り
[CSS] 美しいパンくずを実装する4つのスタイルシート | コリス
画像を使用せずに、シンプルなHTMLで美しいパンくずを実装するスタイルシートのチュートリアルを紹介します。 CSS3 breadcrumbs [ad#ad-2] デモ 実装 デモ デモはCSS3、疑似要素を使用しているため、IE9+, Firefox, Chrome, Safari, Operaでご覧ください。 4つデモは、全て画像を使用していません。 デモページ：ホバー時 実装 HTML HTMLは非常にシンプルで、リスト要素を使用します。 ul要素にid、現在位置にclassを記述します。 <ul id="breadcrumbs-one"> <li><a href="">Lorem ipsum</a></li> <li><a href="">Vivamus nisi eros</a></li> <li><a href="">Nulla sed lorem risus</a></li>
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
