2026
2025
2024
2023
2022
2021
2020
2019
2018
2017
2016
2015
2014
2013
2003年06月の記事
全9件 (9件中 1-9件目)
1
-
【プレート製作】
【製作のキリプレです。】 ６月２９日（日） 画像ばかりで重いと思います・・・すいません。(-_-;) マックのママ115さん。１５９００。７７５００。８８５００。 ３回のキリ番で掲示板プレートを製作しました。 こちらは８５０００のjulynekoさんの日記用のプレート。 ↓ヨコチャンさんのプレート！ ぽちっとな！でみなさんの所へ！(*^^)v 【プチ講座メニュー】は←こちらから！ 【頂き物！】 ６月２８日（土） 今日！澤田さんから頂いたキリ番プレーとです。(*^^)v ”ぽちっとな”で飛びます。(*^^)v
2003/06/29
コメント(10)
-
【背景画像の位置を指定する！】
■【初心者のためのプチ講座VOL.20】■■■■■■■■■■■■■■■■■■■■■ すいません！画像をたくさん使っていますから、表示されない時は 更新してみて下さい。 注：画像は持って行って、直リンクなどしないで下さいね。 お願いします。m(__)m(-_-;)！ ページ上の背景画像をリピートさせなかったり 左右上下に１枚だけ指定するタグを前にやりました。 【ＨＰの飾りつけ教室VOL.9】壁紙を固定してみよう！ その後「日記でも出来ないですか？」というご質問が来ましたので、 日記上で背景画像をリピートさせない方法、 位置を指定する方法をやってみましょう。 この↑画像は背景画像ではありません。 ですから、画像の上には文字が載りませんね。 しかし見てのとうり、一番上一列に並んでいる画像は背景画像です。 背景ですからテキストが載せられます。 前回やりました、「ボックスの中にボックス」を使いまして 背景色を指定したボックスの中に、背景画像を新に指定しています。 ではこのボックスのタグを書いてみましょう。(^_-)-☆ <B style="background-color:背景色; border-style:dotted;border-width:10; color:deeppink;width:100%;"><P style="background-image: url(～背景画像のＵＲＬ～);background-repeat: repeat-x"><font style="filter:shadow(color:black);width:100%;font-size:16;color:white;"> ここに本文や画像を書きます。 ↑この＜font style=～～＞のタグは「影文字のタグ」です。 ＜B style=～～＞が一番外のボックスで背景色を指定しています。 ＜P style=～～＞が背景画像の位置を指定しているボックスです。 </font></P></B> background-repeat: repeat-x が背景画像の位置を指定するタグです。 このタグの repeat-x を repeat-y にしますと、この下にある背景画像のようになります。 background-repeat: repeat-x 上横一行しか画像を「リピート」しません。 background-repeat: repeat-y 左一列しか背景画像を「リピート」しません。 このボックスのタグは↓これです。外側のボックスの背景色を 背景画像に直しています。 <B style="background-image: url(～背景画像のＵＲＬ～); border-style:dotted;border-width:10; color:deeppink;width:100%;"><P style="background-image: url(～背景画像のＵＲＬ～);background-repeat: repeat-y;"><font style="filter:shadow(color:black);width:100%;font-size:16;color:white;"> ここに本文や画像を書きます。 ↑この＜font style=～～＞のタグは「影文字のタグ」です。 ＜B style=～～＞が一番外のボックスで背景画像を指定しています。 ＜P style=～～＞が背景画像の位置を指定しているボックスです。 </font></P></B> 一列、一行だけ「リピート」させる方法のタグはお判りになったでしょうか？ では、「ポジション（位置）」を指定してみましょう。 「ポジション（位置）」は上に紹介したグリーンの２番目のボックスタグの中に 「ポジション（位置）」を指定するタグを追加してあげます。 ↓これです。 background-Position: bottom これを入れた背景画像が下の↓ボックスです。 Ｘ方向（横方向）background-repeat: repeat-x のボトム（一番下）background-Position: bottom に 背景画像を表示させなさいと命令しております。 「位置」（Position）を指定するタグは前にも紹介しましたがもう一度載せてみましょう。 background-Position:位置 「位置」の属性は、 top ボックスの上端(repeat-x) center ボックスの中央(repeat-x.repeat-y) bottom ボックスの下端(repeat-x) left ボックスの左端(repeat-y) right ボックスの右端(repeat-y) このボックスのタグを書きます。 グリーンの２番目のボックスタグの中に 「ポジション（位置）」を指定するタグを追加してあります。 <B style="background-color:#2F4F4F;border-style:dotted;border-width:10; color:deeppink;width:100%;"><P style="background-image: url(～背景画像のＵＲＬ～);background-repeat: repeat-x;background-Position: bottom;"><font style="filter:shadow(color:black);width:100%;font-size:16;color:white;"> ここに本文や画像を書きます。 ↑この＜font style=～～＞のタグは「影文字のタグ」です。 ＜B style=～～＞が一番外のボックスで背景色を指定しています。 ＜P style=～～＞が背景画像の位置を指定しているボックスです。 </font></P></B> では最後に背景画像をまったく「リピート」させないで 一枚だけ「位置」を指定して表示してみましょう。 background-repeat:repeat-x(repeat-y) この部分の repeat-x(repeat-y) これを no-repeat にしますと 一枚だけしか、表示されません。 そして、「位置(Position)」を指定してあげればいいのです。 ↓下のボックスは background-Position: right bottom と指定しています。 right 右の bottom 下端、という事ですね。 このとき、rightとbottom の間には、半角のスペースを入れて下さいね。(*^^)v ではみなさん「ボックスの枠の属性」や「背景色」などをお好みに変えまして、 色々試してみて下さいませ。がんばってください。 ではでは・・・（*^_^*）！ 【プチ講座メニュー】は←こちらから！
2003/06/22
コメント(12)
-
【頂きました！(*^^)v】
おりーぶママさんのキリ番３００００ＨＩＴで頂きました。 手作りパワーストンストラップと、 ダイヤモンドプラチナネックレスです。 これがそうです。説明書きまで書いていただきました。 ほんとうにありがとうございました。 この場をかれまして篤く御礼を申し上げます。（*^_^*） ぽちっとなでおりーぶママさんの所に飛びます。(*^^)v
2003/06/20
コメント(10)
-
【８０００ＨＩＴのプレート！】
【製作のプレート】 julynekoさんへ！キリプレです。８００００ＨＩＴでした。(*^^)v ”ぽちっとな”で飛びます。(*^^)v 【プチ講座メニュー】は←こちらから！
2003/06/18
コメント(10)
-
【ボックスの中にボックス！続き！】
■【ボックスの中にボックス！つづきです(=^_^=)】■■■■■■■■■■■■■■■■■■■ 字数制限でかけなかったボックスの中にボックスのタグを載せておきますね。 （￣+ー￣）キラーン <B style="border-style:solid;border-width:20; border-color:red pink blue green;background-image: url(http://plaza.rakuten.co.jp/img/user/65/14/1286514/53.gif); width:100%; height:100"> <B style="border-style:dotted;border-width:10;background:yellow; color:deeppink; width:80%; height:100"> <B style="cursor:help;width:400;height:250; overflow-y:scroll; overflow-x:auto;border-style:inset;border-width:10; background-color:black;border-color:pink"; onmouseover=this.style.background="#ffffff"; onmouseout=this.style.background="black";><font size="3" color="black" face="ＭＳ Ｐゴシック"> ここに本文を書きます。 画像なども貼ります。</font></B></B> </B> 【プチ講座メニュー】は←こちらから！
2003/06/16
コメント(12)
-
【ボックスの枠を変える！(2)】
■【初心者のためのプチ講座VOL.19】■■■■■■■■■■■■■■■■■ 【ボックスの中にボックス！ボックスの枠を変える！】 で枠の形状の種類を表示させて見ましたが ボックスの枠は、「右」「左」「上」｢下」と個々に指定できます。 border-style:(枠の形状) だけではなく、 border-width:(枠の幅) border-color:(枠の色) も左右上下 個々に指定できます。 例えば、border-style:(枠の形状)で（枠の形状）のところに solid と一つだけ形状を指定しますと border-style:solid このように！ 左右上下 同じ形状のsolid になります。 左右上下の形状を一括して、指定するには↓のように形状を書きますとＯＫです。 ★＝(枠の形状) border-style:★ {上下左右｝同じ形状になります。 border-style:★ ★ ｛上下}{左右｝と指定できます。 border-style:★ ★ ★ ｛上}{左右}{下｝と指定できます。 border-style:★ ★ ★ ★ ｛上}{右}{下}{左｝とすべて指定できます。 形状は半角のスペースで区切って下さい。 では、どのようになるか雛形を表示して見ましょう。 <div style="border-style:dotted;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに本文！</div> <div style="border-style:dotted dashed;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに本文！</div> <div style="border-style:dotted dashed solid;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに本文！</div> <div style="border-style:dotted dashed solid double;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに本文！</div> お判りでしょうか！ 「枠の幅」も「枠の色」も同様に個々に指定できます。 では、「枠の幅」と「枠の色」を同時に指定してみます。 <div style="border-style:solid;border-width:10px; border-color:red;background:white; width:100%; height:100px;">ここに本文！</div> <div style="border-style:solid;border-width:10px 20px; border-color:red pink;background:white; width:100%; height:100px;">ここに本文！</div> <div style="border-style:solid;border-width:10px 20px 30px; border-color:red pink blue;background:white; width:100%; height:100px;">ここに本文！</B> <div style="border-style:solid;border-width:10px 20px 30px 40px; border-color:red pink blue green;background:white; width:100%; height:100px;">ここに本文！</div> どうでしょう！判りますでしょうか？(^_-)-☆
2003/06/15
コメント(6)
-
【ボックスの中にボックス！ボックスの枠を変える！】
■【初心者のためのプチ講座VOL.18】■■■■■■■■■■■■■■■■■以前【日記でボックスを使う】と【ボックスの属性と雛型】で日記でのボックスの使い方を紹介しました。 最近、日記のページで このようなボックスを よく拝見します。 これはどのように やっているのでしょうか？ これは枠の幅を 広くしているだけなのです。今回は、最近よく日記で見かけるボックスをやってみましょう。あれは、ボックスの枠の形状、色を変えているのです。そのボックスをまたボックスの中に入れています。こんな風です。簡単に表示しますと！(=^_^=) こんな枠を使っている人 もいますよね。 一番上のボックスの中に 二番目のボックスを 入れますと こんな風になります。では、枠の幅、枠の形状、枠の色を指定する属性のタグとそれの雛型を載せてみましょう。 まずは、基本のタグを書いて見ます。スタイルシートを指定するのは<div> タグでやります。またまた、↑上のボックスの中に一番上のボックスを入れますとこんなのが出来ます。 ☆⌒(@＾-゜@)v↓これが基本のタグでしたよね。 <div style="border-style:(枠の形状);border-width:(枠の幅);background:(背景の色);color:(枠の色);width:(ボックスの幅); height:(ボックスの高さ)"> ここに、本文を書きます。</div> では、判りやすいように雛形を載せてみますが枠の形状以外は全て同じにします。border-width:(枠の幅)は、10PXに統一します。background:(背景の色)は、WHITE にします。color:(枠の色)は、すべてdeeppink にします。width:(ボックスの幅); height:(ボックスの高さ)は、幅が100% 高さは 100PX にします。<div style="border-style:none;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">枠が出ませんが、出しています。</div> <div style="border-style:dotted;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに、本文を書きます。</div> <div style="border-style:dashed;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに、本文を書きます。</div> <div style="border-style:solid;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに、本文を書きます。</div> <div style="border-style:double;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに、本文を書きます。</div> <B style="border-style:groove;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに、本文を書きます。</div> <div style="border-style:ridge;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに、本文を書きます。</div> <div style="border-style:inset;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに、本文を書きます。</div> <div style="border-style:outset;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに、本文を書きます。</div> <div style="border-style:dotted double;border-width:10px;background:white; color:deeppink; width:100%; height:100px;">ここに、本文を書きます。</div> どうでしょう。枠の形状は分かったでしょうか？続きは明日にでも・・・(*^^)vではでは・・・（*^_^*） 【プチ講座メニュー】は←こちらから！
2003/06/14
コメント(5)
-
【カーソルアイコンのダウンロード＆アップロード】
■【カーソルのダウンロードとアップロード】■■■■■■■■■■■■ 楽天で↑上記のように「カーソル」を指定するには、 「カーソルアイコン」をダウンロード（ＤＬ）しないといけません。 ＤＬは「カーソルアイコン」を置いている、素材屋さんに行きます。 「検索」から【素材 カーソルアイコン】で検索できると思います。 一つ紹介しておきましょう。 http://hp.vector.co.jp/authors/VA010095/aniroom.htm ＤＬした「カーソルアイコン」をアップロードしないと、ＷＥＢ上では表示されません。 しかし、楽天では、「カーソルアイコン」の拡張子である 「cur」「Ani」「ico」をアップロードする事はできません。 「アップロード」とアップローダーを持った、無料のＨＰサイトについては、 私が紹介しています、↓こちらに行ってみて下さい。(*^^)v 【初心者のためのＨＰの飾り付け教室】の「アップロードとは!」それか、 「ホームページ上で音を鳴らすには！」の「ＭＩＤＩをアップロードしてみよう」に行ってみて下さい。 なんとなくアップロードという事が分かると思います。 また、無料でアップローダーを備えたサイトに登録して 画像、ＭＩＤＩなどアップロードする事が出来ます。 そこに、「カーソルアイコン」をアップしまして、「アイコンのＵＲＬ」を 紹介しました、タグの中に入れれば「カーソルアイコン」が表示されます。(*^^)v ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ ご質問ご意見は、掲示板でも私書箱でもいいのですが 【ご質問専用の掲示板】もあります。（ＨＴＭＬ対応） そちらもご利用ください。(*^^)v ではでは！みなさんがんばってください。 【プチ講座メニュー】は←こちらから！ ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
2003/06/07
コメント(13)
-
【ページ全体のカーソルを変える】
【プチ講座】 結構、カーソルの形状を変えるのに反響がありまして、 ページ全体を変えたいというご質問もありましたので、 そのやり方を書いて見ます。 <font style="cursor:url(～カーソルのＵＲＬ～);"> 編集ページの一番最後に </font> これでも、カーソルは表示されますが、 フォントの属性に命令していますから、 フォント(テキスト)がないところは、カーソルが表示されません。 全角のスペースを入れますと、そこは表示されます。 ではまず、各、日記のページにカーソルを指定する事からやって見ます。 <P style="background-color: 色を指定"> 日記の本文 </P><a href=></a> これで日記の背景を指定しましたね。 日記の背景色、背景の壁紙を指定するのは 【プチ講座】■日記に背景を入れる■に行って見て下さい。 ここに、カーソルの命令のスタイルシートを入れればいいのです。 そうすればこうなります。 <P style="background-color: 色を指定;cursor:url(～カーソルのＵＲＬ～);"> 日記の本文 </P><a href=></a> この、「キティーちゃん」カーソルは↑上のタグで出しております。 では、日記の背景画像でやってみましょう。 <P style="background-image: url(～背景画像のＵＲＬ～);cursor:url(～カーソルのＵＲＬ～);"> 日記の本文 </P><a href=></a> 背景画像ではこうなりますね。(*^^)v という事で、取り急ぎ書きました。 みなさん判りましたでしょうか。<font style="cursor:url(～カーソルのＵＲＬ～);"> 個々のテキストのカーソルを変えたいところに！ </font> ↑このタグは、ピンポイント的に使うほうがいいかもしれませんね。(*^^)v ページ全体でカーソルの形状を変えるのは、動作確認したところ、 壁紙の画像が上手く表示されませんでした。 後日確認しまして、ご連絡します。 ではでは・・・！（*^_^*）
2003/06/01
コメント(13)
全9件 (9件中 1-9件目)
1
-
-
- 妖怪ウォッチのグッズいろいろ
- 今日は妖怪ウォッチ見ました&今日の…
- (2026-01-20 16:20:04)
-
-
-
- 模型やってる人、おいで！
- 有井製作所 ＨＯゲージ ＥＤ７０電…
- (2026-08-12 05:25:05)
-
-
-
- 寺社仏閣巡りましょ♪
- 彌彦神社の御神廟
- (2026-08-08 07:31:53)
-
