FTPソフト
ホーム > 表の作成(html)
2017-06- / 05-<< 123456789101112131415161718192021222324252627282930>>07-









スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。




ライン(星)ライン(星)

クリッククリック2 にほんブログ村 小遣いブログ OLのお小遣い稼ぎへ ブログランキングならblogram
                                      
[ --/--/-- ] スポンサー広告 | TB(-) | CM(-)

【見本集】サイト紹介用

サイト紹介用サンプルを作ってみました☆
こちらもメモ代わり♪

使えるものがあれば、htmlはコピペして使っていただいてOKですが、
二次配布は禁止させていただいてますので、よろしくお願いしますヾ(o´∀`o)ノ

また、使用される際にはコメントを残してもらえると嬉しいです♪



バナータグ
一言など☆
オススメ度  ★★★★★
ポイント交換先  ○○銀行 他
レート  1pt=1円
交換手数料  無料
換金可能  3000pt(換算300円)~
振込日  即時
有効期限  なし
紹介制度  あり
運営会社  株式会社○○

<center><table bordercolor="#ff80c0" cellspacing="3" cellpadding="2" border="3"><tbody>
<tr><td bgcolor="#ffeaea" colspan="2" style="text-align: center">
バナータグ <br />
一言など☆ <br />
</td></tr>
<tr><td align="center" width="150">オススメ度</td>
<td width="250" align="left"> ★★★★★</td></tr>
<tr><td align="center">ポイント交換先</td>
<td align="left"> ○○銀行 他</td></tr>
<tr><td align="center">レート</td>
<td align="left"> 1pt=1円</td></tr>
<tr><td align="center">交換手数料</td>
<td align="left"> 無料</td></tr>
<tr><td align="center">換金可能</td>
<td align="left"> 3000pt(換算300円)~</td></tr><tr>
<td align="center">振込日</td>
<td align="left"> 即時</td></tr>
<tr><td align="center">有効期限</td>
<td align="left"> なし</td></tr>
<tr><td align="center">紹介制度</td>
<td align="left"> あり</td></tr>
<tr><td align="center">運営会社</td>
<td align="left"> 株式会社○○</td></tr>
</tbody></table></center>


自分好みに変更したい場合には、表の作成方法(基本・タグの意味)を参考に、
数値などを変更してみてくださいねヽ(*´∀`*)ノ.+゚

スポンサーサイト




ライン(星)ライン(星)

クリッククリック2 にほんブログ村 小遣いブログ OLのお小遣い稼ぎへ ブログランキングならblogram
                                      
[ 2013/09/20 ] 表の作成(html) | TB(0) | CM(0)

【見本集】収入集計用

収入集計用サンプルを作ってみました☆
こちらもメモ代わり♪

今までは『ドット枠』を使ってたんですが、換金回数と総額も入れて心機一転してみました☆

使えるものがあれば、htmlはコピペして使っていただいてOKですが、
二次配布は禁止させていただいてますので、よろしくお願いしますヾ(o´∀`o)ノ

また、使用される際にはコメントを残してもらえると嬉しいです♪



20●●年●実績
ポイントサイト ●●円
サイト名 換金額 換金先 回数 総額
げん玉 ●●銀行
●● ●●銀行
アンケートサイト ●●円
サイト名 換金額 換金先 回数 総額
●● ●●銀行
●● ●●銀行
ブログライター ●●円
サイト名 換金額 換金先 回数 総額
●● ●●銀行
●● ●●銀行
ASP ●●円
サイト名 換金額 換金先 回数 総額
●● ●●銀行
●● ●●銀行
その他 ●●円
サイト名 換金額 換金先 回数 総額
●● ●●銀行
●● ●●銀行
合計 ●●円 総額●●円

<center><table bordercolor="#4169e1" cellspacing="5" cellpadding="2" border="3"><tbody>
<tr><td bgcolor="#e0ffff" height="30" valign="middle" colspan="5">20●●年●実績</td></tr>
<tr><td bgcolor="#add8e6" height="25" valign="middle" colspan="5" style="text-align: center">ポイントサイト ●●円 </td></tr>
<tr><td bgcolor="#f0fff0" width="100" align="center">サイト名</td>
<td bgcolor="#f0fff0" width="80" align="center">換金額</td>
<td bgcolor="#f0fff0" width="100" align="center">換金先</td>
<td bgcolor="#f0fff0" width="50" align="center">回数</td>
<td bgcolor="#f0fff0" width="100" align="center">総額</td></tr>
<tr><td width="100" align="center">げん玉</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td width="100" align="center">●●</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td bgcolor="#add8e6" height="25" valign="middle" colspan="5" style="text-align: center">アンケートサイト ●●円 </td></tr>
<tr><td bgcolor="#f0fff0" width="100" align="center">サイト名</td>
<td bgcolor="#f0fff0" width="80" align="center">換金額</td>
<td bgcolor="#f0fff0" width="100" align="center">換金先</td>
<td bgcolor="#f0fff0" width="50" align="center">回数</td>
<td bgcolor="#f0fff0" width="100" align="center">総額</td></tr>
<tr><td width="100" align="center">●●</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td width="100" align="center">●●</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td bgcolor="#add8e6" height="25" valign="middle" colspan="5" style="text-align: center">ブログライター ●●円 </td></tr>
<tr><td bgcolor="#f0fff0" width="100" align="center">サイト名</td>
<td bgcolor="#f0fff0" width="80" align="center">換金額</td>
<td bgcolor="#f0fff0" width="100" align="center">換金先</td>
<td bgcolor="#f0fff0" width="50" align="center">回数</td>
<td bgcolor="#f0fff0" width="100" align="center">総額</td></tr>
<tr><td width="100" align="center">●●</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td width="100" align="center">●●</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td bgcolor="#add8e6" height="25" valign="middle" colspan="5" style="text-align: center">ASP ●●円 </td></tr>
<tr><td bgcolor="#f0fff0" width="100" align="center">サイト名</td>
<td bgcolor="#f0fff0" width="80" align="center">換金額</td>
<td bgcolor="#f0fff0" width="100" align="center">換金先</td>
<td bgcolor="#f0fff0" width="50" align="center">回数</td>
<td bgcolor="#f0fff0" width="100" align="center">総額</td></tr>
<tr><td width="100" align="center">●●</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td width="100" align="center">●●</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td bgcolor="#add8e6" height="25" valign="middle" colspan="5" style="text-align: center">その他 ●●円 </td></tr>
<tr><td bgcolor="#f0fff0" width="100" align="center">サイト名</td>
<td bgcolor="#f0fff0" width="80" align="center">換金額</td>
<td bgcolor="#f0fff0" width="100" align="center">換金先</td>
<td bgcolor="#f0fff0" width="50" align="center">回数</td>
<td bgcolor="#f0fff0" width="100" align="center">総額</td></tr>
<tr><td width="100" align="center">●●</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td width="100" align="center">●●</td>
<td width="80" align="right">円</td>
<td width="100" align="center">●●銀行</td>
<td width="50" align="right">回</td>
<td width="100" align="right">円</td></tr>
<tr><td bgcolor="#e0ffff" height="30" valign="middle" colspan="3">合計 ●●円
<td bgcolor="#e0ffff" height="30" colspan="2" valign="middle">総額●●円</td></tr>
</tbody></table></center>


自分好みに変更したい場合には、表の作成方法(基本・タグの意味)を参考に、
数値などを変更してみてくださいねヽ(*´∀`*)ノ.+゚





ライン(星)ライン(星)

クリッククリック2 にほんブログ村 小遣いブログ OLのお小遣い稼ぎへ ブログランキングならblogram
                                      
[ 2013/09/19 ] 表の作成(html) | TB(0) | CM(0)

【見本集】小見出し

小見出しのサンプルを作ってみました☆
こちらもメモ代わりに…♪

使えるものがあれば、htmlはコピペして使っていただいてOKですが、
二次配布は禁止させていただいてますので、よろしくお願いしますヾ(o´∀`o)ノ




サンプル1
 
<span style="font-size:14px;"><div style="padding:10px 0 10px 5px ;border-color:#ff8c00;border-width:0 0 1px 7px;border-style:solid;background:#ffffff;"><b>サンプル1</b></div></span>



サンプル2
 
<span style="font-size:14px;"><div style="padding:1px 0px 1px 5px ;border-color:#ff8c00;border-width:0 0 1px 7px;border-style:solid;background:#ffdead;"><b>サンプル2</b></div></span> 



サンプル3

<span style="font-size:14px;"><div style="padding:1px 0px 1px 5px ;border-color:#1e90ff;border-width:0 0 1px 7px;border-style:solid;background:#e0ffff;"><b><span style="color:#1e90ff">サンプル3</span></b></div></span>



サンプル4

<span style="font-size:14px;"><div style="padding:1px 0px 1px 5px ;border-color:#ff1493;border-width:0 0 1px 7px;border-style:solid;background:#ffefd5;"><b><span style="color:#ff1493">サンプル4</span></b></div></span>



サンプル5

<span style="font-size:14px;"><div style="padding:1px 0px 1px 5px ;border-color:#006400;border-width:0 0 1px 7px;border-style:double;background:#98fb98;"><b><span style="color:#006400">サンプル5</span></b></div>



サンプル6
 
<span style="font-size:14px;"><div style="padding:10px 0px 10px 5px ;border-color:#ff8c00;border-width:7px 7px 7px 7px;border-style:double;background:#ffffff;"><b>サンプル6</b></div></span>



サンプル7
 
<span style="font-size:14px;"><div style="padding:10px 0px 10px 5px ;border-color:#ff8c00;border-width:1px 1px 1px 7px;border-style:solid;background:#ffffff;"><b>サンプル7</b></div></span>






ライン(星)ライン(星)

クリッククリック2 にほんブログ村 小遣いブログ OLのお小遣い稼ぎへ ブログランキングならblogram
                                      
[ 2013/09/18 ] 表の作成(html) | TB(0) | CM(1)

小見出しを付ける方法

小見出し ってご存知でしょうか?

 これが小見出し☆


当ブログ内でもよく使っているんですが、話題の切り替えとかに便利ですよね♪

ちなみに上の小見出しのhtmlはこうなってます。
<span style="font-size:14px;"><div style="padding:10px 0 10px 5px ;border-color:#ff8c00;border-width:0 0 1px 7px;border-style:solid;background:#ffffff;">これが小見出し☆</div></span> 



字の大きさ(font-size)を変更すれば、小見出しの大きさも変わります。
例えば、数字部分を『large』に変更してみると、こうなります。
サンプル1

実際に入力しているhtmlはコチラ↓
<span style="font-size:large;"><div style="padding:10px 0 10px 5px ;border-color:#ff8c00;border-width:0 0 1px 7px;border-style:solid;background:#ffffff;">サンプル1</div></span> 

文字サイズに関しては文字のサイズを変える方法で説明しているので、参考にしてみてください☆


色を変えたければ『border-color(枠線)』と『background-color(背景)』を指定すればOKです!
サンプル2

実際に入力しているhtmlはコチラ↓(枠線を黒、背景を白指定)
<span style="font-size:large;"><div style="padding:10px 0 10px 5px;border-color:#000000;border-width:0 0 1px 7px;border-style:solid;background-color:#ffffff;">サンプル2</div></span> 

色は自分の好きなものを指定してみてください♪
マネキ☆ネコが参考にさせていただいているのは【WEB色見本 原色大辞典】さんのページです(´∀`●)


小見出しの枠の太さも変更できますよ☆
サンプル3

<span style="font-size:14px;"><div style="padding:10px 0 10px 5px;border-color:#ff8c00;border-width:0 0 1px 15px;border-style:solid;background:#ffffff;">サンプル3</div></span> 

これは左の枠を太くしてみましたが、数字指定【 上 右 下 左 】の順で枠の太さは変更できるので、いろいろ数字を変更してみてくださいね。


枠内の余白も変更できます。
サンプル4

<span style="font-size:14px;"><div style="padding:0 0 0 10px;border-color:#ff8c00;border-width:0 0 1px 7px;border-style:solid;background:#ffffff;">サンプル4</div></span> 

枠同様に、数字指定【 上 右 下 左 】の順で余白の太さは変更できるので、いろいろ数字を変更してみてください。
これは左のみ余白を入れ、上下右は余白なしにしていしています。


小見出しを効果的に使って、より見やすいページに整理していきたいものです(*ノ∀`*)




ライン(星)ライン(星)

クリッククリック2 にほんブログ村 小遣いブログ OLのお小遣い稼ぎへ ブログランキングならblogram
                                      
[ 2013/09/17 ] 表の作成(html) | TB(0) | CM(4)

枠線の種類

枠線の種類です(*^-^)
覚えてしまうと表のアレンジが楽しくなりますよ☆

 枠線の種類タグ


枠線の種類
タグ 表示内容サンプル
none なし
1234567890
solid 実線
1234567890
dashed 点線(直線)
1234567890
dotted 点線(丸)
1234567890
double  二重線
1234567890
groove 立体枠
1234567890
ridge  立体枠
1234567890
inset 立体枠
1234567890
outset 立体枠
1234567890
 



ライン(星)ライン(星)

クリッククリック2 にほんブログ村 小遣いブログ OLのお小遣い稼ぎへ ブログランキングならblogram
                                      
[ 2011/11/17 ] 表の作成(html) | TB(0) | CM(10)


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。