賢威メモ

今回はちょっとメモ。 

長年賢威を使ってきていますが、
私の場合、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情報、その他ネットビジネスに関する情報をいち早く配信しています。

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

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

サブコンテンツ

危険な高額塾

タグ

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

アーカイブ

エステトラブル

このページの先頭へ