よくあるご質問

カテゴリー: CSS, shuttoの使い方, 編集メニュー   タグ:   この投稿のパーマリンク

CSS設定にある「@current」は何でしょうか?

このページに記載されている「CSS」「JavaScript」等は、あくまでも記述例となっております。ご利用するPCサイトによって変更しないといけない場合があります。
そのため、このまま使用しサイトに異常が出た場合は、サポートは対象外となりますので、予めご了承の上ご利用いただけますようお願いいたします。

@currentとは、選択している要素にのみCSSを適用させたい場合や、
PCサイトのCSSにshutto上で書いたCSSが上書きされる場合などにCSSの文頭につけるshuttoの独自仕様です。

◆使用例

@current a {
  color: blue;
  text-decoration: none;
}
@current ul {
  list-style: none;
  margin: 0;
}

@currentは、変換後にドラック&ドロップをした要素を囲むdivに付与されるID「shutto-component-**」に置換されます。

◆変換後htmlソース例

<div class="shutto-component shutto-component-group shutto-prop-noborder" id="shutto-component-20">
ここにドラッグ&ドロップした要素が入ります
</div>

//上記CSS例の変換後
#shutto-component-20 a {
  color: blue;
  text-decoration: none;
}
#shutto-component-20 ul {
  list-style: none;
  margin: 0;
}
カテゴリー: CSS, shuttoの使い方, 編集メニュー   タグ:   この投稿のパーマリンク

「shuttoを使ってきれいなページを作りたい」「ページが多いので、外部の会社の手を借りたい」 そういったご要望がございましたら実績のある制作パートナー様にご相談ください。