サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
衆院選
jobtech.jp
よく使われるclass名の命名規則 HTMLにclass名をつける時の代表的な命名規則には以下の3つがあります。今回はこの中のBEMについて紹介します。 BEM(Block-Element-Modifier:ベム) OOCSS(Object Oriented CSS:オーオーシーエスエス) SMACSS(Scalable and Modular Architecture for CSS:スマックス) BEMとは BEM(ベム)はHTML要素を「Block」「Element」「Modifier」に分けてclass名をつけます。この3つの頭文字を使って「BEM」と呼びます。 BEMのメリット パーツ単位でデザインを管理する為、変更時に他のパーツへの影響を考慮しなくていい セレクタを入れ子にしないので優先度問題が発生しにくい BEMを採用している会社が多い BEMのデメリット class名が長い
テスト環境:「外観」>「ウィジェット」の上部に「Import/Export」ボタンがあるのでクリックしてウィジェット情報をエクスポートする。
Sass(SCSS)を利用するための環境構築 まずはSass(SCSS)を利用するための環境構築をしてから。こちらで解説しています。 SublimeText3にSass(SCSS)・Compassのパッケージをインストール パッケージインストール画面呼び出し Windows:「Ctrl」+「Shift」+「p」 「ins」と入力して「Package Control: Install Package」を選択して「Enter」 インストールするパッケージ Sass SASS Build SCSS SCSS Snippets SublimeOnSaveBuild(保存時に自動コンパイルする場合) Compass テスト用フォルダ構成 test_sassフォルダ ┣ config.rb ┗ style.scss config.rb Compass用設定ファイル require 'compass/i
ファイルの操作 ファイル名を検索して開く Windows:Ctrl+P Mac:Cmd+P 表示された入力欄にファイル名の一部を入力すると検索結果が表示されるので選択して開きます。 使用言語の指定 Windows:Ctrl+Shift+P Mac:Cmd+Shift+P 表示された入力欄に使用する言語名の一部を入力すると検索結果に「Set Syntax」が表示されるので選択します。 使用言語を指定することで言語にあった色分けや入力補完を表示してくれます。 文字の大きさを変える Windows:Ctrl+Shift++、Ctrl+- Mac:Cmd+Shift++、Cmd+- カーソルの操作 複数のカーソルを配置する Windows:Ctrl+クリック Mac:Cmd+クリック クリック位置にカーソルを配置し一度に複数個所を編集することができます。 ※下図のように複数個所に同じclass名を
Dreamweaver CS6でEmmet(次世代ZenCoding)をインストールした場合、Emmetの展開ショートカットであるCtrl+Eキーが初期ショートカットとバッティングしています。 使いやすさを考慮して展開ショートカットをTabキーに変更します。 メニューバー[編集]>[キーボードショートカット]を選択。 キーボードショートカット画面でEmmetの「Expand Abbreviation」を選択し[変更]をクリック。 コマンド:メニューコマンド コマンド>Emmet>Expand Abbreviation 「デフォルトセットは変更できません・・・」のメッセージが表示されるので[OK]ボタンを押してデフォルトセットの複製を作る。 セットの複製画面で複製セットの名前を決める。今回は「Dreamweaver Standard 2」で作成。 もう一度キーボードショートカット画面でEmm
人気記事一覧を表示することができる「WP-PostViews」にアイキャッチを表示させる方法のメモ。 WP-PostViewsプラグイン編集 管理画面の「プラグイン」>「プラグイン編集」を選択。 右上のセレクトボックスから「WP-PostViews」を選択して「wp-postviews/wp-postviews.php」を編集。 最初の追記 $post_excerpt = views_post_excerpt($post->post_excerpt, $post->post_content, $post->post_password, $chars);
このページを最初にブックマークしてみませんか?
『EmmetをJSPで使用する方法:VSCode』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く