賢威メモ

今回はちょっとメモ。 

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

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

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

サブコンテンツ

危険な高額塾

タグ

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

アーカイブ

エステトラブル

このページの先頭へ