賢威メモ

今回はちょっとメモ。 

長年賢威を使ってきていますが、
私の場合、DreamWeaverに予めサイトのCSSを読み込ませているテンプレートを
作っておき、そこで書いてからコピペで記事を作成していたのであまり使った事が
なかったんですが、賢威には便利なCSSが用意されているんですね。

いったん記事を上げた後にちょこっと修正するときに手書きでやっていたので
覚えておくと便利かなと。

 

■よくあるようなチェックボックスの一覧

<ul class="checklist">
<li>ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。</li>
<li>ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。</li>
<li>ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。</li>
</ul>
  • ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。
  • ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。
  • ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。

 

 

■文字色

<ul>
<li><span class="black">文字色を黒色に変更することができます。</span></li>
<li><span class="red">文字色を赤色に変更することができます。</span></li>
<li><span class="blue">文字色を青色に変更することができます。</span></li>
<li><span class="green">文字色を緑色に変更することができます。</span></li>
<li><span class="yellow">文字色を黄色く変更することができます。</span></li>
<li><span class="navy">文字色を紺色に変更することができます。</span></li>
<li><span class="gray">文字色を灰色に変更することができます。</span></li>
<li><span class="orange">文字色をオレンジに変更することができます。</span></li>
<li><span class="pink">文字色をピンクに変更することができます。</span></li>
<li><span class="purple">文字色を紫色に変更することができます。</span></li>
<li><span class="olive">文字色を黄土色に変更することができます。</span></li>
<li><span class="lime">文字色を黄緑に変更することができます。</span></li>
<li><span class="aqua">文字色を水色に変更することができます。</span></li>
</ul>
  • 文字色を黒色に変更することができます。
  • 文字色を赤色に変更することができます。
  • 文字色を青色に変更することができます。
  • 文字色を緑色に変更することができます。
  • 文字色を黄色く変更することができます。
  • 文字色を紺色に変更することができます。
  • 文字色を灰色に変更することができます。
  • 文字色をオレンジに変更することができます。
  • 文字色をピンクに変更することができます。
  • 文字色を紫色に変更することができます。
  • 文字色を黄土色に変更することができます。
  • 文字色を黄緑に変更することができます。
  • 文字色を水色に変更することができます。

 

 

■背景色

<ul>
<li><span class="box-yellow">文字を黄色いボックスで囲むことができます。</span></li>
<li><span class="box-aqua">文字を水色のボックスで囲むことができます。</span></li>
<li><span class="box-gray">文字を灰色のボックスで囲むことができます。</span></li>
<li><span class="box-red">文字を赤色のボックスで囲むことができます。</span></li>
</ul>
  • 文字を黄色いボックスで囲むことができます。
  • 文字を水色のボックスで囲むことができます。
  • 文字を灰色のボックスで囲むことができます。
  • 文字を赤色のボックスで囲むことができます。

 

 

■文字サイズ

<ol>
<li><span class="b">文字を太字にすることができます。</span></li>
<li><span class="f12em">文字を「120%」の大きさにすることができます。</span></li>
<li><span class="f15em">文字を「150%」の大きさにすることができます。</span></li>
<li><span class="f18em">文字を「180%」の大きさにすることができます。</span></li>
<li><span class="f08em">文字を「80%」の大きさにすることができます。</span></li>
</ol>
  1. 文字を太字にすることができます。
  2. 文字を「120%」の大きさにすることができます。
  3. 文字を「150%」の大きさにすることができます。
  4. 文字を「180%」の大きさにすることができます。
  5. 文字を「80%」の大きさにすることができます。

 

 

■アイコン付き文字

<p class="caution1">先頭にCHECK!という画像が付いた状態で表示されます。</p>
<p class="caution2">先頭にCHECK!という画像が付いた状態で表示されます。</p>
<p class="caution3">先頭にPOINT!という画像が付いた状態で表示されます。</p>
<p class="caution4">先頭にPOINT!という画像が付いた状態で表示されます。</p>
<p class="caution5">先頭にCHECK!という画像が付いた状態で表示されます。</p>
<p class="caution6">先頭にPOINT!という画像が付いた状態で表示されます。</p>
<p class="caution7">先頭に注意!という画像が付いた状態で表示されます。</p>
<p class="caution8">先頭に注意!という画像が付いた状態で表示されます。</p>

先頭にCHECK!という画像が付いた状態で表示されます。

先頭にCHECK!という画像が付いた状態で表示されます。

先頭にPOINT!という画像が付いた状態で表示されます。

先頭にPOINT!という画像が付いた状態で表示されます。

先頭にCHECK!という画像が付いた状態で表示されます。

先頭にPOINT!という画像が付いた状態で表示されます。

先頭に注意!という画像が付いた状態で表示されます。

先頭に注意!という画像が付いた状態で表示されます。

 

 

■後アイコン付き文字

<p class="al-r"><span class="mail-back">一行なら文章の終わりにも使えます。</span></p>
<p class="al-r"><span class="pdf-back">一行なら文章の終わりにも使えます。</span></p>
<p class="al-r"><span class="zip-back">一行なら文章の終わりにも使えます。</span></p>
<p class="al-r"><span class="rss-back">一行なら文章の終わりにも使えます。</span></p>

一行なら文章の終わりにも使えます。

一行なら文章の終わりにも使えます。

一行なら文章の終わりにも使えます。

一行なら文章の終わりにも使えます。

 

 

■文字線付き

<ul>
<li><span class="underline">文字に下線を引くことができます。</span></li>
<li><span class="del">文字に取り消し線を引くことができます。</span></li>
</ul>
  • 文字に下線を引くことができます。
  • 文字に取り消し線を引くことができます。

 

 

■次ページなど

<p class="link-next"><a href="/">次のページへ</a></p>
<p class="link-back"><a href="/">前のページへ</a></p>

 

 

■Youtube動画の埋め込み

<div class="v-wrap al-c m30-b">
<iframe width="420" height="315" src="http://www.youtube.com/embed/-ujaHz-RwNs" frameborder="0" allowfullscreen></iframe>
</div>

 

 

■売れ筋ランキング

<ul class="ranking">
<li class="no01">
<p class="item-name">商品名1</p>
<p class="item-img"><img src="http://j-press.info/wp-content/themes/keni6_wp_cool_130218/images/dummy-item01.jpg" width="162" height="162" alt="AAA社画像" /></p>
<p>ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。</p>
<p class="link-next02"><a href="./item01/">「商品名1」の詳細を見る</a></p>
</li>

<li class="no02">
<p class="item-name">商品名2</p>
<p class="item-img"><img src="http://j-press.info/wp-content/themes/keni6_wp_cool_130218/images/dummy-item02.jpg" width="162" height="162" alt="AAA社画像" /></p>
<p>ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。</p>
<p class="link-next02"><a href="./item/item02/">「商品名2」の詳細を見る</a></p>
</li>

<li class="no03">
<p class="item-name">商品名3</p>
<p class="item-img"><img src="http://j-press.info/wp-content/themes/keni6_wp_cool_130218/images/dummy-item03.jpg" width="162" height="162" alt="AAA社画像" /></p>
<p>ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。</p>
<p class="link-next02"><a href="./item/item03/">「商品名3」の詳細を見る</a></p>
</li>

<li class="no04">
<p class="item-name">商品名4</p>
<p>ここにテキストが入ります。ここにテキストが入ります。</p>
<p class="link-next02"><a href="#">「商品名4」の詳細を見る</a></p>
</li>

<li class="no05 end">
<p class="item-name">商品名5</p>
<p>ここにテキストが入ります。ここにテキストが入ります。</p>
<p class="link-next02"><a href="#">「商品名5」の詳細を見る</a></p>
</li>
</ul>
  • 商品名1

    AAA社画像

    ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。

  • 商品名2

    AAA社画像

    ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。

  • 商品名3

    AAA社画像

    ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。ここにテキストが入ります。

  • 商品名4

    ここにテキストが入ります。ここにテキストが入ります。

  • 商品名5

    ここにテキストが入ります。ここにテキストが入ります。

 

この投稿は役に立ちましたか? 役に立った 役に立たなかった

 

ネットビジネス速報メールマガジン

 

メルのネットビジネス速報では、悪質高額塾などの被害が拡大しないように
新しい悪質販売者の情報が入り次第、速報でお伝えいたします。

Dreamweaver、Fireworks、PhotoshopなどのTipsやチュートリアルの紹介、
最新SEO情報、その他ネットビジネスに関する情報をいち早く配信しています。

お名前(必須)
メールアドレス(必須)

記事「賢威メモ」にコメントを残す

*

サブコンテンツ

危険な高額塾

タグ

ざくざく君 Tiger-Wing ハート .htaccess 定型文 HTML4.0 ドメイン 石井匠 スムーズ 無料オファー 日本語入力変換ソフト twitter wordpress 株式会社SRシステム 音量アイコン トラフィック 到達率 RMT 原田真 プロファイル SyntaxHighlighter インターネットエクスプローラー Baidu ブラクラ サイト改ざん 蝶乃舞 脆弱性 不正送信 XHTML html エクスプローラー office 新井浩 ぼかし css ファビコン ユーチューブマニアクス2017 SKナレッジ ライオンアフィリエイト ECサイト 画像 ツイッター 切り抜き 大西良幸 伊藤虎太郎 ブルートフォースアタック 立体 ネットガレージ 球体 カスタマイズ 出店料 大園麗花 株式会社A-ブログレス 自動 量産 IP 不労所得の神 メルマガ配信システム 加工 getElementByTagName リンクシェイカー EC 比較 Ban Hammer Newpost Catch 自己アフィリエイト 無断送信 申請金ビジネス 秀吉塾天下統一 掲示板 レイアウト崩れ Wordpress Content Slide ヤフオク バックアップ スタイルシート google document.all アレックス postpost ウイルス YouTube Maniax 2017 MT ライブチャット 優先順位 三橋美仁 MasterCollection 賢威 android サンタ 背景 無料 登録禁止 エキスパートメール ヤフー エディタ マイクロソフト クラウド変換 パズル ネオヒルズアカデミー Chrome 高額塾 関根義光 改竄 せどり 宮田麗花 Agency Business MovableTYpe タスクバー LinkShaker 詐欺組織 与沢翼 デスクトップ 管理画面 wp-login.php 池田純矢 株式会社SRシステム 自己アフィリ 百度 レンタルサーバー 伊藤 虎太郎 加藤 秀吉 特定のメールアドレス プロモーション JavaScript バナー ビジネス BUYMA functions.php レビュー Favicon 81a338 レタープレス 固定ページ 株式会社ニュース 久積篤史 @PAGES ネットビジネス最後の楽園 アドセンス やしろひろたみ アンダーグラウンドメソッド テーマ 上位表示 ソース クリックランキング 自動化 ネットショップ Thunderbird 短縮URLツール Extension Manager DTD Adobe ブラシ 表示 小笠原健一 個人情報 大園式転売塾 RSS ブロックポリシー 情報商材 ブラウザ 株式会社Free Agent Style KMS認証 トレンドキーワード もざ アフィ匠 moza インターネット メモ Yahoo 改ざん 流出 フレンドシップメール tool レイアウト KMSpico アクセスアップ 詐欺 管理ツール 高速ゲーム 土屋ひろし エクスチェンジ 大園転売塾 感染 Firefox ライン 与沢翼×蝶乃舞 インターネットビジネススクール Youtube CGI Internet Explorer Google Maps アフィリエイト スマホ ping送信 権利収入 PHP アイコン ツール followmatic 関根塾 ブロック 中山秀人 個人情報流出 ネットゲーム Windows 7 人物 フォローマティック CS5 WEB IE WP モザイク RSS Includes Pages トレンドアフィリエイト SmoothScroll.js FTP ヤフーショッピング クラック 伊藤塾 インフォトップ Windows DOCTYPE 切抜き 株式会社バンザイ ボタン High Concept Marketing タイガーウイング getElementById ソースコード wpXサーバー プラグイン グラデーション Login LockDown 短縮URL PPC スクロール CS6 FireWorks 副業術 BBIZ 北川 雅嗣 コピーボタン ping 山下 スカイプ ランキング クロスアフィリエイト シャンプー 特権ビジネス explorer 復元 秒速で1億円稼ぐ男 転売大園塾 マルウエア ワードプレス アレックス式ネオせどりスクール ロリポップ 配布 インペリアルゴールド 放射線 system Diamond Affiliate Masters Program Google Maps API ネットビジネス 伊藤 歩 滑らか 株式会社WINGOOD セキュリティ やしろ塾 テンプレート SEO ムーバブルタイプ 不正アクセス iphone バイドゥー force puzzle ソフト Cash on Wordpress IBS がら空きビジネス マニュアル アクセス制限 ウインドウ 村上省吾 クラウド入力機能 アンダーグラウンドアフィリエイトクラブ ネットビジネス大全集 Line 既得権益 バイマ

アーカイブ

エステトラブル

このページの先頭へ