作成日
2015/02/02最終更新
2017/10/17記事区分
一般公開関連記事
- CSS 設計に関するヒントCSS は構造化が難しくスタイルを宣言していくだけで目的が達成できてしまいます。上書きの繰り返しによって肥大化しないための設計ヒントをまとめます。 詳細度の高騰が発生した CSS は破綻しやすい CSS の詳細度はルーティングテーブルのロンゲストマッチのようなものです。一致度の高いとされるセレクタで指定したスタイルが優先的に適用されます。同じ詳細度の場合は後から指定したスタイルで上書かれて適用され...
- フォーム入力 (Bootstrap 3)フォーム関連の Bootstrap 3 の機能をコード例とともに列挙します。公式ページは CSS/Forms です。JavaScript には依存せずに動作します。 標準的なレイアウト <div class="container"></div> に含めて使用します。まとまりごとに form-group で囲います。 <form> <!-- 一行入力 -...
- Sass チートシートSass (Syntactically Awesome Stylesheets) のチートシートです。インデントを多用した SASS 記法ではなく、広く普及している SCSS 構文の Sass を対象とします。 継承 (extend) 基本 .class1 { background-color: #f00; } .class2 { @extend .class1; colo...
- グリッドレイアウトでレスポンシブ Web デザイン (Bootstrap 3)グリッドレイアウトによるレスポンシブ Web デザインを Bootstrap 3 で行う方法を記載します。 すべての要素の入れ物であるコンテナ要素 公式ドキュメントの一番最初に記載されている container はすべての要素の入れ物です。コンテンツ全体を container で囲みます。container には四種類の幅があります。container の左右にはマージンが作られます。入れ子にする...
- CSS で部品を装飾 (Bootstrap 3)公式ドキュメントのうち JavaScript に依存せず CSS だけで部品を装飾する Bootstrap 3 の機能をコード例とともに列挙します。公式ページは CSS Components および CSS です。 グリフアイコン [使用できるアイコン一覧](http://getbootstrap.com/components/#glyphicon