Jimdo-classes

最終更新日 2013年6月19日
Jimdo レイアウト用クラス集
用途
ページ別のレイアウト
タグ
body
ul
ナビゲーションのレイアウト
a
Class名
初期プロパティ・値
出現場所
body
全ページのbodyタグ
cc-page
全ページのbodyタグ
cc-content-parent
全ページのbodyタグ
cc-page-index
トップページ、利用規約ページ、返品条件ページ、ショップ情報ページ、精算ページ、サイトマップページのbodyタグ
cc-pageindex
cc-pagemode-default
トップページ、利用規約ページ、返品条件ページ、ショップ情報ページ、精算ページ、サイトマップページのbodyタグ
トップページ、下層ページ、概要ページ、ブログページのbodyタグ
cc-pagemode-sitetemplate
利用規約ページ、返品条件ページ、ショップ情報ページ、精算ページのbodyタグ
cc-pagemode-overlay
プライバシーステートメント、サイトマップページのbodyタグ
cc-page-blog
ブログページのbodyタグ
mainNav1
第一階層ページに該当するulタグ
mainNav2
mainNav3
第二階層ページに該当するulタグ
第三階層ページに該当するulタグ
level_1
第一階層ページに該当するaタグ
level_2
第二階層ページに該当するaタグ
level_3
第三階層ページに該当するaタグ
current
parent
現在表示しているページに該当するaタグ
現在表示しているページが子ページの場合、親ページに該当するaタグ
float: left;
leftrow
div
コンテンツメニューのレイアウト
div
n
見出しエレメント
div
j-header
写真エレメント
div
j-imageSubtitle
文章エレメント
写真付き文章エレメント
div
div
j-text
j-textWithImage
rightrow
カラムエレメント
div
余白エレメント
表エレメント
フォトギャラリーエレメント
div
div
div
ファイルダウンロードエレメント
div
text-align: left;
印刷用、サイトマップなどへのリンクを囲むdivタグ
width: 55%;
float: right;
フッターのレイアウト
text-align: right;
width: 42%;
height: 1%;
padding: 5px;
padding: 1px !important
ログイン、ログアウトなどのリンクを囲むdivタグ
コンテンツメニューから作成した各エレメントを囲むdivタグ
見出しエレメントを囲むdivタグ
写真エレメントを囲むdivタグ
文章エレメントを囲むdivタグ
写真付き文章エレメントを囲むdivタグ
j-hgrid
padding: 1px !important;
float: left;
カラムエレメントを囲むdivタグ
cc-m-hgrid-column
padding: 0 2% 0 0;
作成したカラムを囲むdivタグ
min-height: 1px;
j-spacing
j-table
j-gallery
j-downloadDocument
leftDownload
rightDownload
余白エレメントを囲むdivタグ
表エレメントを囲むdivタグ
フォトギャラリーエレメントを囲むdivタグ
ファイルダウンロードエレメントを囲むdivタグ
width: 52px;
float: left;
margin-left: 55px;
padding-left: 6px;
j-formnew
ファイルのアイコンを囲むdivタグ
ファイルのタイトルや説明が表示される部分を囲むdivタグ
フォームエレメントを囲むdivタグ
clear: both;
cc-m-form-view-element
padding: 5px;
フォームから作成したすべての項目を囲むdivタグ
position: relative;
フォームエレメント
div
水平線エレメント
div
div
cc-m-form-text
cc-m-form-email
cc-m-form-calendar
cc-m-form-textarea
cc-m-form-number
cc-m-form-select
cc-m-form-radio
cc-m-form-check
cc-m-form-checkgroup
cc-m-form-subheading
cc-m-form-view-captcha
cc-m-form-view-submit
j-hr
j-comment
ul
com-list
テキストフィールド項目を囲むdivタグ
メールアドレス項目を囲むdivタグ
カレンダー項目を囲むdivタグ
テキストエリア項目を囲むdivタグ
数字項目を囲むdivタグ
ドロップダウンリスト項目を囲むdivタグ
ラジオボタン項目を囲むdivタグ
シングルチェックボックス項目を囲むdivタグ
複数チェックボックス項目を囲むdivタグ
カテゴリータイトル項目を囲むdivタグ
スパム防止項目を囲むdivタグ
送信ボタンを囲むdivタグ
水平線エレメントを囲むdivタグ
ゲストブックエレメントを囲むdivタグ
margin: 0 0 15px 0;
padding: 0;
display: block;
コメントを表示する部分全体を囲むulタグ
border-top: 1px solid #CCC;
ゲストブックエレメント
li
commentstd
padding: 12px 0 12px 0;
position: relative;
コメントを表示する部分全体を囲むulタグの直下のliタグ
list-style: none;
list-style-image: none;
YouTube等エレメント
Flickrエレメント
Google マップエレメント
ウィジェットエレメント
商品エレメント
商品カタログエレメント
RSSフイードエレメント
Twitterエレメント
Facebookエレメント
Google+エレメント
シェアボタンエレメント
div
div
div
div
div
div
div
div
div
div
div
j-video
j-flickr
j-googlemaps
j-htmlCode
j-product
j-catalog
j-rss
j-twitter
j-facebook
j-googleplus
j-sharebuttons
j-BlogSelection
j-blogarticle
padding: 5px 0;
float: left;
YouTube等エレメントを囲むdivタグ
Flickrエレメントを囲むdivタグ
Google マップエレメントを囲むdivタグ
ウィジェットエレメントを囲むdivタグ
商品エレメントを囲むdivタグ
商品カタログエレメントを囲むdivタグ
RSSフィードエレメントを囲むdivタグ
Twitterエレメントを囲むdivタグ
Facebookエレメントを囲むdivタグ
Google+エレメントを囲むdivタグ
シェアボタンエレメントを囲むdivタグ
ブログ表示エレメントを囲むdivタグ
タイトルや日付を囲むdivタグ
width: 44px;
ブログ表示エレメント
div
height: 45px;
datetime
margin: 0 10px 10px 0;
ブログの日付を囲むdivタグ
background:
url(/s/img/cc/datesticker-bg.png)
no-repeat center center;
dt-alignment-right
float: right;
display: block;
ブログの日付を囲むdivタグ
position: fixed;
ul
cc-FloatingButtonBarContainer
z-index: 10100;
bottom: 54px;
トップへ戻るボタンを囲むulタグ
right: 60px;
トップへ戻るボタンのレイアウト
list-style-type: none;
display: block;
li
cc-FloatingButtonBarContainer-button-scroll-show
margin-right: 2px;
トップへ戻るボタンを囲むulタグの直下のliタグ
float: left;
background: #EEE;
margin-top: 10px;
cc-sidecart-header
padding: 7px 7px;
タイトル「ショッピングカート」と上部の購入ボタンを囲むdivタグ
border-bottom: 1px solid #CCC;
color: #333;
background: white;
cc-sidecart-header
ショッピングカートのレイアウト
padding: 10px 5px;
border-bottom: 1px solid #CCC;
商品写真や商品名を囲むdivタグ min-height: 80px;
font-size: 12px;
div
cc-sidecart-calculation
line-height: 16px;
小計を囲むdivタグ
text-align: left;
overflow: hidden;
background: #EEE;
cc-sidecart-footer
padding: 5px 7px;
下部の購入ボタンを囲むdivタグ
margin-bottom: 10px;
border-top: 1px solid #CCC;
© 2013 Magical Remix&Co.