CSSやHTMLで困っている人に読んでほしい!

ブログやwordpressを使っていると、ちょっと工夫した見せ方したいときありますよね?!
例えば、divやtableを使って以下のようなデザインを作りたい時ありませんか??
レイアウトテーブル

このような横並びの組合せをdivやtableタグを使って、作るのは本当に面倒です。

無料で使えるdivtableサービス

このようになります。
ページング表示も可能な為、とても便利です!
レイアウトテーブル


このようなdivやtableタグを使ったレイアウトの見せ方以外にも、テキストに影を付けたりColumnでレイアウトの見せ方を英字新聞風にしてみたり、面倒なCSSとHTMLタグの作成がボタン操作が可能となります。

divtableサービスの使い方

メニューから使いたいタグを選択
CSSジェネレーション無料メニュー

次に、レイアウト上の画面中央にある「div/table」のラジオチェックボタンで選択

CSSジェネレーション無料メニューDIVtable
色やセルの幅など細かな調整もここで可能です。

次に、レイアウト上の画面中央にある「BODY」の箇所で色や箱の数を指定します。

CSSジェネレーション無料メニューBODY
「div/table」で作りたい箱の数は、マウスで指定できます。

次に、レイアウト上の画面中央にある「Header/Footer」の箇所で色や上下に付く、ヘッダー、フッター要素を決めていきます。

CSSジェネレーション無料メニューheader
本ページ上部の画では、フッターがありません。
フッターを付けたければ、ラジオチェックにチェックを入れて生成すると



このようになります。
ページング表示も可能な為、とても便利です!
CSSジェネレーション無料メニューfooter

最後に、画面下部にあるソース部分をコピー

あなたが使いたいページに張り付けてください。
その際、HTMLとCSSがわかれているので、同じページに貼ってはいけません!
例えば、WordPressをお使いなら
HTMLは記事本文内に
CSSは、WordPressの管理画面から  外観  テーマ編集  style.css
このstyle.css内にCSSをペーストしてください。

カラムのレイアウト作成はマジ便利

これが作れます。
カラムレイアウト英字新聞

バーで調整してレイアウトを作成する事が可能

カラム設定

HTMLに貼るタグをCSSのタブをコピー

カラムCSS取得

カラムの数の変更は可能

カラムの変更

div/table生成サービス