質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

CSSフレームワーク

CSSフレームワークは、Webページのスタイルを指定する言語であるCSSを容易に構築するためのツールです。ツイッター社が開発した「Bootstrap」や段組レイアウトが可能な「Foundation」など様々なCSSフレームワークがあります。

Q&A

1回答

1445閲覧

FLOCSSでのネーミングについて

yusukexyusuke

総合スコア52

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

CSSフレームワーク

CSSフレームワークは、Webページのスタイルを指定する言語であるCSSを容易に構築するためのツールです。ツイッター社が開発した「Bootstrap」や段組レイアウトが可能な「Foundation」など様々なCSSフレームワークがあります。

0グッド

1クリップ

投稿2016/11/24 11:43

宜しくお願い致します。

イメージ説明

このようなデザインがあるとします。

パターン1は私は
イメージ説明
と作ります。

パターン2を作る時に悩みます。。。

p-menuという名前でいきたいけど、
どうやるか。。。

css

1/* menu */ 2.p-menu {} 3.p-menu--horizonal { 4 .p-menu__title {} 5 .p-menu__list {} 6} 7.p-menu--vertical { 8 .p-menu__title {} 9 .p-menu__list {} 10} 11 12/* menus */ 13.p-menus {} 14.p-menus--horizonal { 15 .p-menus__item {} 16} 17.p-menus--vertical { 18 .p-menus__item {} 19}

とやる方法を考えたのですが、
プロジェクト同士でカスケーディングで調整するのは
ルール違反なような気がしてしまい、、、

もしくはmenuをcomponentにうつして

css

1.p-menu--horizonal { 2 c-menu {} 3 c-menu__title {} 4 c-menu__list {} 5 6 c-menus {} 7 c-menus__title {} 8 c-menus__item {} 9} 10.p-menu--horizonal { 11 c-menu {} 12 c-menu__title {} 13 c-menu__list {} 14 15 c-menus {} 16 c-menus__title {} 17 c-menus__item {} 18}

とやるか。

そもそもcssの名前をまったく別にするか。
しかしmenuは他で登場するわけでもなく、
componentにする程でもないかな。
なんて思ってしまい。

悩んでおります。

みなさまならどうしますでしょうか。
身近に相談できる人がおらず困っております。

どうか宜しくお願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

他に使い回す予定がないのでしたら、p-menusを廃止して、p-menus__itemp-menu__listItemという風にしてみてはどうでしょうか。
こうした上で以下のようにスタイルを指定すれば、違和感はなくなりませんか?

css

1.p-menu--vertical{ 2 .p-menu__listItem{ 3 /* ... */ 4 } 5}

投稿2016/12/05 00:08

milktea

総合スコア116

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問