- ホーム >
- フリー素材
寺院向けフリー素材集：飾り枠（その2）
額縁イメージの飾り枠（縦伸縮）
|
ダウンロード用画像
|
||||||||||||||||||
設置の仕方（HTMLソース） 赤い文字の部分を任意に書き換えて下さい |
|||||||||||||||||||
額縁イメージの飾り枠（横伸縮）
|
ダウンロード用画像
|
||||||||||
設置の仕方（HTMLソース） 赤い文字の部分を任意に書き換えて下さい
ヘッダに次の一行を挿入 <meta http-equiv="Content-Style-Type" content="text/css"> --------------------------- <table style="width:***px; height:271px;" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="1" rowspan="3" style="background-image:url(./フォルダ名/b_left.gif); width:23px;"></td> <td style="background-image:url(./フォルダ名/b_top.gif); height:24px;"></td> <td colspan="1" rowspan="3" style="background-image:url(./フォルダ名/b_right.gif); width:20px;"></td> </tr> <tr> <td style="height:227px; padding:*px; background-color:white;">ここにテキストまたは画像</td> </tr> <tr> <td style="background-image:url(./フォルダ名/b_bottom.gif); height:20px;"></td> </tr> </tbody> </table> |
|||||||||||
額縁イメージの飾り枠（縦横伸縮）
|
縦横に伸縮するので、画像を入れるのに適しています 下のサンプル画像は、大阪教区のHPからお借りしました
|
ダウンロード用画像
|
||||||||||||||||||
| 設置の仕方（HTMLソース）
赤い文字の部分を任意に書き換えて下さい
ヘッダに次の一行を挿入 <meta http-equiv="Content-Style-Type" content="text/css"> --------------------------- <table border="0" cellpadding="0" cellspacing="0"> <tr> <td style="width:23px; height:24px; background-image:url(./フォルダ名/c_corner_1.gif);"></td> <td style="height:24px; background-image:url(./フォルダ名/c_top.gif);"></td> <td style="width:20px; height:24px; background-image:url(./フォルダ名/c_corner_2.gif);"></td> </tr> <tr> <td style="width: 23px; background-image:url(./フォルダ名/c_left.gif);"></td> <td><img src="./フォルダ名/ファイル名" alt="画像名" border="0" width="200" height="203"></td> <td style="width: 20px; background-image:url(./フォルダ名/c_right.gif);"></td> </tr> <tr> <td style="width: 23px; height: 20px; background-image:url(./フォルダ名/c_corner_3.gif);"></td> <td style="height: 20px; background-image:url(./フォルダ名/c_bottom.gif);"></td> <td style="width: 20px; height: 20px; background-image:url(./フォルダ名/c_corner_4.gif);"></td> </tr> </table> |
|||||||||||||||||||
額縁イメージの飾り枠（縦横伸縮）
|
上と同様で、素材のみ変えました。
|
ダウンロード用画像
|
<meta http-equiv="Content-Style-Type" content="text/css">
---------------------------
<table style="width:270px;" border="0" cellpadding="0" cellspacing="0">
<tr> <td colspan="3" rowspan="1" style="height:24px; background-image:url(./フォルダ名/a_top.gif);"></td> </tr>
<tr>
<td style="width:23px; background-image:url(./フォルダ名/a_left.gif);"></td>
<td style="width:227px; padding:*px; background-color:white;">ここにテキストまたは画像</td>
<td style="width:20px; background-image:url(./フォルダ名/a_right.gif);"></td>
</tr>
<tr> <td colspan="3" rowspan="1" style="height:20px; background-image:url(./フォルダ名/a_bottom.gif);"></td> </tr>
</table>