2012年11月の記事
全25件 (25件中 1-25件目)
1
-
練習（2012.11.29）1
前回の 猫ちゃんは炬燵が好き？ で背景を設定することを試してみましたが、今回は再度、背景を設定することを練習してみます。今回は、HTMLのコードを表示するのに苦戦しました。(TT)何故か、背景画像のアドレスの表示が長すぎて、横にはみ出し、全体の表示が横長になって、おかしくなってしまったのです。どこかが間違ってそんな風になるのかなと思いながらも、解決できませんでしたが、overflowプロパティがあることがわかり、試してみたら何とか表示がされました。また、前々回で試していた “margin-left:”で左側の距離を今回もやってみたのですが、やり方が間違っていたのか？何かが足りないのか？基本的なものがわかっていないからなのか？思うような位置に表示できずに、今回は“positoin:relatibe;left:" でも出来る事がわかり、なんとか思うような位置に設定できたので使ってみました。こんな風に大まかなことしか基本もわかっていないんですよね。簡単な辞典片手にやっているので、興味だけで、やっているものですから･･。なんといっても、最近本当にいろんな事が覚えられずにいるので、脳トレ？感覚でやっています。（ここでの説明や内容は自分がわかるようにという程度の内容です。正確ではないものが多々あると思いますのでご了承ください。）☆背景に画像を入れる※<要素名 style="background-image:url(画像のｱﾄﾞﾚｽ)"> ～</要素名> ･･ 背景に画像を指定［ 背景画像表示のタグ内に ］※width="数値%" ･･････ 背景画像の幅 (%)画面に対する割合※height="数値%" ･････ 背景画像の高さ (px)ﾋﾟｸｾﾙで指定可［ 画像表示のタグ内に ］※width="数値px" ･････････････ 枠の幅※height="数値px" ････････････ 枠の高さ※align="位置px"left ･････ 画像の左側に文章が表示center ･･ 画像の中央に文章が表示right ･･･ 画像の右側に文章が表示※hspace="数値px" ････････････ 枠からの間隔※style="線の種類；太さ；色"・border-style:線の種類solid ･･････ 実線 / double ････ 二重線dashed ････ 破線 / dotted ････ 点線 ridge ･･････ 盛上線 / groove ････ 窪み線outset ･････ 盛上枠 / inset ･･････ 窪み枠 ・border-width:数値px ･････････ 枠線の太さ・border-color:#RGB値（6桁） ･･･ 枠の色※<要素名 style="positoin:relative-left:数値px"> ～</要素名> ･･ 相対的な位置で左からの距離 背景に画像を表示 今回は、この画像を背景に設定したいと思います。点線の枠､文字の下に２つのイラスト設置♪二重線の枠､文字下に２個のイラスト設置♥<div style="background-image:url(http://image.space.rakuten.co.jp/d/strg/ctrl/9/5e8bb1590ebd72696cedd433b3015acdfb03b871.09.2.9.2.gif);width:100%;hight:100%"><font size="3" color="#000080"><b><img src="http://image.space.rakuten.co.jp/lg01/39/0000670039/81/img4192c545zikdzj.jpeg" alt="招き猫緑.JPEG" width="150" height="150" align="right" hspace=18 style="border-style:dotted;border-width:10px;border-color:#ff0000"><center>点線の枠､文字の下に２つのイラスト設置<font color="green">♪</font></center><i style="position:relative;left:150px"><img src="http://image.space.rakuten.co.jp/lg01/39/0000670039/21/img51eaa48fzik8zj.gif" alt="カップ" border="0"></i><i style="position:relative;left:250px"><img src="http://image.space.rakuten.co.jp/lg01/39/0000670039/03/imgd8dda88bzikfzj.gif" alt="hato1" border="0"></i><img src="http://image.space.rakuten.co.jp/lg01/39/0000670039/80/img3e367803zik2zj.jpeg" alt="招き猫赤.JPEG" width="150" height="150" align="left" hspace=18 style="border-style:double;border-width:10px;border-color:#ffff00"><center>二重線の枠､文字下に２個のイラスト設置<font color="red">♥</font></center><i style="position:relative;left:130px"><img src="http://image.space.rakuten.co.jp/lg01/39/0000670039/05/img2fec9198zik1zj.gif" alt="hato2" border="0"></i><i style="position:relative;left:80px"><img src="http://image.space.rakuten.co.jp/lg01/39/0000670039/08/imgb53a7eb6zik5zj.gif" alt="ハート2" border="0"></i><br clear="all"></b></font></div>
2012.11.29
コメント(0)
-
猫ちゃんは炬燵が好き？
すごい格好で寝ていますよね♪ここは 炬燵の中なんですよ ♥炬燵がお気に入りなんです！？
2012.11.28
コメント(0)
-
練習（2012.11.27）１
前回の ちょっと珍しい？ で試した内容を少し変えてHTMLのコードを表示しています。画像を花のイラストに変えましたが、画像に盛上りの枠を設定したのと文章の行間を1.5倍にするのは同じです。画像の高さが違うので、前回は改行の回数が結構あったのですが、今回は少なすぎて見にくくなっています。(^^ちなみに、毎回HTMLのコードがはみ出ていたので、枠内の入れて表示してみました。（ここでの説明や内容は自分がわかるようにとメモ書き程度の内容です。正確ではないものが多々あると思いますのでご了承ください。）☆画像に枠を設定する［ 画像表示のタグ内に ］※width="数値px" ･････････････ 枠の幅※height="数値px" ････････････ 枠の高さ※align="位置px"left ･････ 画像の左側に文章が表示center ･･ 画像の中央に文章が表示right ･･･ 画像の右側に文章が表示※hspace="数値px" ････････････ 枠からの間隔※style="線の種類・太さ・色"・border-style:線の種類solid ･･････ 実線 / double ････ 二重線dashed ････ 破線 / dotted ････ 点線 ridge ･･････ 盛上線 / groove ････ 窪み線outset ･････ 盛上枠 / inset ･･････ 窪み枠 ・border-width:数値px ･････････ 枠線の太さ・border-color:#RGB値（6桁） ･･･ 枠の色※<要素名 style="line-height:数値em"> ～</要素名> ･･･ 行の高さ（行間）※<要素名 style="margin-left:数値px"> ～</要素名> ･･･ 左からの余白 花のイラストを表示 画像を左側に、文章を右側に表示。枠は色を黄色にして盛上り線に。枠のサイズは幅・高さとも100ピクセルです。
2012.11.27
コメント(0)
-
ちょっと珍しい？
この画像は、にらの花をそのままにして、種が出来るのを待っていたのですが、さらに韮のようなものが伸びてきました。もしかしたら、そのままの状態で、種から芽が出てきたような状態？にしか思えません。
2012.11.27
コメント(0)
-
練習（2012.11.26）1
今回は、以前 文章を枠で囲む２ で試した内容を少し変えて、枠の中に画像をはめ込むことをやってみたいと思います。ちなみに、ここでの説明は自分がわかるようにとメモ書き程度の内容です。正確なものではないものが多々あると思いますのでご了承ください。☆文章の枠内に背景画像を入れる※<div align="画像の位置">････left ････ 画像を左側right ･･･ 画像を中央center ･･ 画像を右側［ 画像表示のタグ内に ］※width:数値px ･････････････ 枠の幅※height:数値px ････････････ 枠の高さ※text-align:位置left ･････ 画像の左側に文章が表示center ･･ 画像の中央に文章が表示right ･･･ 画像の右側に文章が表示※font-size:数値px ････････････ 文字の大きさ※color:#RGB値（6桁） ･････････ 文字の色※padding:数値px ････････････ 枠からの間隔※border-style:線の種類solid ･･･････ 実線 / double ････ 二重線dashed ････ 破線 / dotted ････ 点線 ridge ･･････ 盛上線 / groove ････ 窪み線outset ･････ 盛上枠 / inset ･･････ 窪み枠 ※border-width:数値px ････････ 枠線の太さ※border-color:#RGB値（6桁） ･･･ 枠の色※background-image:url(URL) ････････ 背景の画像の設定 枠内に画像の背景を 猫ちゃんのイラストを背景に入れてみました。ここに、文章を書いてください。<div align="center"><p style="width:300px;height:200px;background-image:url(http://image.space.rakuten.co.jp/d/strg/ctrl/9/c17c5d285a43a4ebd5eb496dd7b4b85bc196cc9e.09.2.9.2.gif);text-align:left;font-size:18px;color:#666600;padding:15px;border-style:double;border-width:3px;border-color:#003399">猫ちゃんのイラストを背景に入れてみました。ここに、文章を書いてください。</p></div>
2012.11.26
コメント(0)
-
練習（2012.11.25）3
前回の画像を続けて表示に近い感じになりますが、ちゃんと、画像を左右にその真ん中に文章を書くことを試してみます。また、文章の回りこみを解除をすると、真ん中の文章などが解除されます。ただ改行や文章の量しだいでは、必要ないのかもしれませんが。☆画像を左右に文章を中央に［ 画像表示のタグ内に ］※align="画像の位置"left ････ 画像が左側で文章が右側に表示right ･･･ 画像が右側で文章が左側に表示※hspace=数値（ピクセル数[ドット数]）････画像の左右の空白を指定※<br clear="画像の位置">････画像への回り込みを解除するleft ････ 左側の画像に対する回りこみの解除right ･･･ 右側の画像に対する回り込みの解除all ･････ 両側の画像に対する回り込みの解除 両画像の中央に文章 今回は画像を左右に表示させ文章を中央に表示させていますサンタさんに囲まれて！！<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/20fe36329bbc4b8ff6bd89993eacc66d3784b32b.09.2.9.2.gif" alt="サンタ１" border="0" align="left" hspace=40><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/8738c8ecb737faa4325c620833e374c4002c94e1.09.2.9.2.gif" alt="サンタ２" border="0" align="right" hspace=40><center>今回は画像を左右に表示させ文章を中央に表示させていますサンタさんに囲まれて！！</center><hr><br clear="all"><hr>
2012.11.25
コメント(0)
-
練習（2012.11.25）2
前回、画像に対して文章の回りこみを左右に設定していたら、今回の最初の画像と文章のように重なってしまい、考えていたような表示が出来なかったのです。 文章の回り込みの解除: <br clear="画像の位置"> を追加して、重ならないようしてみました。☆画像の周りに文章を入れる２［ 画像表示のタグ内に ］※align="画像の位置"left ････ 画像が左側で文章が右側に表示right ･･･ 画像が右側で文章が左側に表示※hspace=数値（ピクセル数[ドット数]）････画像の左右の空白を指定※<br clear="画像の位置">････画像への回り込みを解除するleft ････ 左側の画像に対する回りこみの解除right ･･･ 右側の画像に対する回り込みの解除all ･････ 両側の画像に対する回り込みの解除 前回の画像を続けて表示 今回は画像の右側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。今回は画像の左側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/20fe36329bbc4b8ff6bd89993eacc66d3784b32b.09.2.9.2.gif" alt="サンタ１" border="0" align="left" hspace=40>今回は画像の右側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/8738c8ecb737faa4325c620833e374c4002c94e1.09.2.9.2.gif" alt="サンタ２" border="0" align="right" hspace=40>今回は画像の左側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。 文章の回りこみを解除 今回は画像の右側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。今回は画像の左側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/20fe36329bbc4b8ff6bd89993eacc66d3784b32b.09.2.9.2.gif" alt="サンタ１" border="0" align="left" hspace=40>今回は画像の右側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。<br clear="left"><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/8738c8ecb737faa4325c620833e374c4002c94e1.09.2.9.2.gif" alt="サンタ２" border="0" align="right" hspace=40>今回は画像の左側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。<br clear="right">
2012.11.25
コメント(0)
-
練習（2012.11.25）1
今回は画像の横に文章を表示させる練習です。サンタのイラストを使って、画像の右側と左側に文章を表示してみました。表示させていて、ちょっとした問題が･･･というよりは、考えていたとおりには表示できなかったので、その解決方法を次回にやってみるつもりです。（ちなみに下記は解決済みです）☆画像の周りに文章を入れる１［ 画像表示のタグ内に ］※align="画像の位置"left ････ 画像が左側で文章が右側に表示right ･･･ 画像が右側で文章が左側に表示※hspace=数値（ピクセル数[ドット数]）････画像の左右の空白を指定注意：align属性"を省略すると、１行分だけの横に表示をされます。 文章を画像の右側に 今回は画像の右側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/20fe36329bbc4b8ff6bd89993eacc66d3784b32b.09.2.9.2.gif" alt="サンタ１" border="0" align="left" hspace=40>今回は画像の右側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。 文章を画像の左側に 今回は画像の左側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/8738c8ecb737faa4325c620833e374c4002c94e1.09.2.9.2.gif" alt="サンタ２" border="0" align="right" hspace=40>今回は画像の左側に文字を表示させています。１行だけでなく、複数行表示することが出来ることの確認です。
2012.11.25
コメント(0)
-
練習（2012.11.24）1
同一ライン上に画像と文字列も表示でき、画像に対して文字列の上下位置の表示を指定できるみたいです。画像の表示するタグ内に“align=”を使い指定して、いくつか試してみます。１行だけの指定ということなのですが、文章が多かったらどうなるのかなと、それも試してみました。画像の周りの空間も広げてみたり･･･☆画像に対する文字の上下の配置※align="配置"top ･･･････ 画像の最上部に文字列を表示middle ･･･ 画像の中央部に文字列を表示center ･･･ 画像の中央部に文字列をす表示bottom ･･･ 画像の最下部に文字列を表示※hspace=数値（ピクセル数[ドット数]）････画像と文字列との間隔を指定注意：align属性"を省略すると、"bottom"の表示をされます。注意：指定できるのは、画像と同じ行にある１行だけです注意：hspace属性"を省略すると、hspace=0として表示をされます。 １行内の場合 ★ベル★イラストのどの位置に表示されるか確認。★★ツリー★★イラストのどの位置に表示されるか確認。★★★リース★★★イラストのどの位置に表示されるか確認。★ベル★<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/11b200e87a88abfe0e543a1525cfe3b767d9fbe5.09.2.9.2.gif" alt="ベル" border="0" align="top">イラストのどの位置に表示されるか確認。★★ツリー★★<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/f80dd90e1aad34bad0ca0ec4e62a040292a01ff1.09.2.9.2.gif" alt="ツリー" border="0" align="center">イラストのどの位置に表示されるか確認。★★★リース★★★<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/da262ab7184bcf995e524532b56022fc48e32749.09.2.9.2.gif" alt="リース" border="0" align="bottom">イラストのどの位置に表示されるか確認。 文章が多い場合 ★ベル★クリスマスが近いので、こんなイラストを載せてみました。一行内だったら大丈夫みたいですが、文章が長かったらどうなるのでしょうか？★★ツリー★★クリスマスが近いので、こんなイラストを載せてみました。一行内だったら大丈夫みたいですが、文章が長かったらどうなるのでしょうか？★★★リース★★★クリスマスが近いので、こんなイラストを載せてみました。一行内だったら大丈夫みたいですが、文章が長かったらどうなるのでしょうか？★ベル★<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/11b200e87a88abfe0e543a1525cfe3b767d9fbe5.09.2.9.2.gif" alt="ベル" border="0" align="top" hspace=30>イラストのどの位置に表示されるか確認。１行内だったら大丈夫みたいですが、文章が長かったらどうなるのでしょうか？★ツリー★★<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/f80dd90e1aad34bad0ca0ec4e62a040292a01ff1.09.2.9.2.gif" alt="ツリー" border="0" align="middle" hspace=30>イラストのどの位置に表示されるか確認。１行内だったら大丈夫みたいですが、文章が長かったらどうなるのでしょうか？★リース★★★<img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/da262ab7184bcf995e524532b56022fc48e32749.09.2.9.2.gif" alt="リース" border="0" align="bottom" hspace=30>イラストのどの位置に表示されるか確認。１行内だったら大丈夫みたいですが、文章が長かったらどうなるのでしょうか？
2012.11.24
コメント(0)
-
練習（2012.11.23）1
今回は、画像の位置を右端や中央に設置する方法を試してみました。画像をそのまま３つを呼び出すと、横並びになるのでそれを使ってみました。いつもは<div>を使っていましたが、<p>も使えるみたいだったので、試してみました。☆画像の配置１※<div align="配置">（画像）</div>･･･（段落をブロック単位で揃える）left（左端）・ center（中央）・ right（右端）※<p align="配置">（画像）</p>････････（段落で行揃え）left（左端）・ center（中央）・ right（右端） 未設定：（左端） <img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/11b200e87a88abfe0e543a1525cfe3b767d9fbe5.09.2.9.2.gif" alt="ベル" border="0"><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/f80dd90e1aad34bad0ca0ec4e62a040292a01ff1.09.2.9.2.gif" alt="ツリー" border="0"><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/da262ab7184bcf995e524532b56022fc48e32749.09.2.9.2.gif" alt="リース" border="0"> <div>使用：（中央） <div align="center"><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/11b200e87a88abfe0e543a1525cfe3b767d9fbe5.09.2.9.2.gif" alt="ベル" border="0"><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/f80dd90e1aad34bad0ca0ec4e62a040292a01ff1.09.2.9.2.gif" alt="ツリー" border="0"><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/da262ab7184bcf995e524532b56022fc48e32749.09.2.9.2.gif" alt="リース" border="0"></div> <p>使用：（右端） <p align="right"><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/11b200e87a88abfe0e543a1525cfe3b767d9fbe5.09.2.9.2.gif" alt="ベル" border="0"><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/f80dd90e1aad34bad0ca0ec4e62a040292a01ff1.09.2.9.2.gif" alt="ツリー" border="0"><img src="http://image.space.rakuten.co.jp/d/strg/ctrl/9/da262ab7184bcf995e524532b56022fc48e32749.09.2.9.2.gif" alt="リース" border="0"></p>
2012.11.23
コメント(0)
-
安く買えました！！
安く買えました！！この間、店舗の外に、かわいい柄のティーポットを見つけたんです店内に同じものがあったのですが価格が2000円台だったのです外のは半額以下だったのでかなり迷ったのですが買っちゃいましたついでにその横にあった同じ柄の湯のみ2個も買ってしまいました店内のティーポットと違って何か問題があるはずと思っていたのですが帰ってふたに貼ってあったシールをはがしてみたらやっぱりありましたぽつんと色汚れが･･覚悟はしていたもののふたは目立つかな～？でも、お得な価格で手に入ったのでよかったです(^-^)
2012.11.23
コメント(0)
-
練習（2012.11.22）1
前回の内容に、文字の大きさや色を変える事や枠の配置を変える方法を試してみました。もっといろんな方法が出来るのかもしれませんが･･･また、何をしているのかの説明不足ですみません。☆文章を枠で囲む２※枠の幅....... width:数値px （未設定は画面の幅に設定される）※枠の高さ..... height:数値px （未設定は文章で調整されます）※文字の位置...text-align: ･･････ left（左寄）・center（中央）・right（右寄）※空間の幅...... padding:数値px ※枠の様式...... border-style: ････ double（二重線）・dashe（破線）等※枠線の太さ... border-width:数値px※枠線の色...... border-color:#RGB値（6桁） ※文字の大きさ...font-size:数値px※文字の色...... color:#RGB値（6桁）※枠の位置...... <div align: ･････ left（左寄）・center（中央）・right（右寄）>（ブロックレベルの範囲設定）文章を書いてください。<p style="width:160px;height:60px;text-align:left;padding:15px;border-style:solid;border-width:3px;border-color:#ff3399">文章を書いてください。</p>--文字の大きさと色を変える。枠を盛上げる--。 追加：［font-size:25px;color:"#00ff00"］ 変更：［border-style:ridge］文章を書いてください。<p style="width:160px;height:60px;text-align:left;font-size:25px;color:#00ff00;padding:15px;border-style:ridge;border-width:3px;border-color:#ff3399">文章を書いてください。</p>文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。<p style="width:160px;text-align:left;padding:15px;border-style:solid;border-width:3px;border-color:#003399">文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。</p>--枠の位置を変える。文字の大きさと色を変える。枠を二重線に--。 追加：<div align="center">～</div> と［font-size:18px;color:"#666600"］ 変更：［border-style:double］文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。<div align="center"><p style="width:160px;text-align:left;font-size:18px;color:#666600;padding:15px;border-style:double;border-width:3px;border-color:#003399">文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。</p></div>
2012.11.22
コメント(0)
-
練習（2012.11.21）1
今回もどこかミスっているのかもと思いました。「日記のプレビュー」の表示と「下書き保存」や「公開する」の確認の表示と“ブログの公開”の後の表示には微妙に違うみたいです。危うく、その表示の違いを間違っている、出来ないと思い込んでしまったりしました。結局は、“ブログの公開”の後の表示がちゃんと出来ればいいのだと思いました。（ちゃんと、表示されていたらいいのですが･･･）☆文章を枠で囲む※枠の幅....... width:数値px （未設定は画面の幅に設定される）※枠の高さ..... height:数値px （未設定は文章で調整されます）※文字の位置... text-align: ･･････ left（左寄）・center（中央）・right（右寄）※空間の幅...... padding:数値px ※枠の様式...... border-style: ････ double（二重線）・dashe（破線）等※枠線の太さ... border-width:数値px※枠線の色...... border-color:#RGB値（6桁） 文章を書いてください。<p style="width:160px;height:60px;text-align:left;padding:15px;border-style:solid;border-width:3px;border-color:#ff3399">文章を書いてください。</p>文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。<p style="width:160px;height:60px;text-align:left;padding:15px;border-style:solid;border-width:3px;border-color:#003399">文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。</p>文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。<p style="width:160px;text-align:left;padding:15px;border-style:solid;border-width:3px;border-color:#003399">文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。</p>文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。<p style="height:60px;text-align:left;padding:15px;border-style:solid;border-width:3px;border-color:#dd6699">文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。</p>文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。<p style="text-align:left;padding:15px;border-style:solid;border-width:3px;border-color:#cc0000">文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。文章を書いてください。</p>
2012.11.21
コメント(0)
-
練習（2012.11.20）1
昨日書いたものに、足りないところというか勘違いをしていたところがあったので、同じようなものですが今回も挑戦したいと思います。追加1：文字の大きさを変えようと下記のタグ内の“font-size:”で数値を大きくを変更し、「日記のプレビュー」と「下書き保存」と「公開するときの確認の表示」で確認しても、ちゃんと変わっていたのに、ブログに公開されたら、文字サイズが変わっていませんでした私もこうしたら出来るのではと、いろいろ試しながらやっているところがあるので、間違っていたらすみません。それにしてもこんなこともあるのですね。出来たと思っていたのにがっくりです･･･追加2：後で試してみましたが、文字の大きさを変えるには、下記のタグの前に <font size="数値">・・・・・</font>を記入すると変わりました。追加3：やはり間違っていました。下記タグ内の font-size:数値 → font-size:数値px に変更（単に px を追記しただけです）したら、ちゃんと表示されました。この小さなミスが大きく響くのですね☆文字を枠で囲む２※枠の様式........ border: ･･････････ solid（実線）・double（二重線）・dashed（破線）等※枠の太さ........ 様式の後･････････ 数値（ﾋﾟｸｾﾙ）px →皆同じ設定。前回の倍の値にしてみました※枠の色.............. border-color: ････ #RGB値（6桁） →前回設定無しです。前回の枠と同じ色の設定です※文字の大きさ...font-size: ････････ 数値px →文字の大きさと段階的に大きくしています ※文字の色........ color: ･･･････････ #RGB値（6桁） →線の色と文字の色を変えています. 実線の枠です .<font style="border:solid 8px;border-color:#008000;font-size:15px;color:#0055ff">. 実線の枠です .</font>. 二重線の枠です .<font style="border:double 8px;border-color:#ff3300;font-size:20px;color:#669900">. 二重線の枠です .</font>. 破線の枠です .<font style="border:dashed 8px;border-color:#ffcc00;font-size:25px;color:#cc55ff">. 破線の枠です .</font>. 点線の枠です .<font style="border:dotted 8px;border-color:#339933;font-size:30px;color:#005555">. 点線の枠です .</font>. 盛上線の枠です .<font style="border:ridge 8px;border-color:#ff0000;font-size:35px;color:#000000">. 盛上線の枠です .</font>. 窪み線の枠です .<font style="border:groove 8px;border-color:#ff7f50;font-size:40px;color:#005500">. 窪み線の枠です .</font>. 盛上の枠です .<font style="border:outset 8px;border-color:#4b0082;font-size:45px;color:#ff55ff">. 盛上の枠です .</font>. 窪みの枠です .<font style="border:inset 8px;border-color:#20b2aa;font-size:50px;color:#9955ff">. 窪みの枠です .</font>
2012.11.20
コメント(0)
-
練習（2012.11.19）2
こうして書き出しているにもかかわらず、すぐに忘れてしまうのですだからこそ、なんとかすぐに使えるように、整理できればと思っています☆文字を枠で囲む※枠の様式...... border: ･･･････ solid（実線）・double（二重線）・dashed（破線）等※枠の太さ...... 様式の後･･････ 数値（ﾋﾟｸｾﾙ）(px)※枠･文字の色.. color: ････････ RGB値（6桁）. 実線の枠です .<font style="border:solid 4px;color:#008000">. 実線の枠です .</font>. 二重線の枠です .<font style="border:double 4px;color:#ff3300">. 二重線の枠です .</font>. 破線の枠です .<font style="border:dashed 4px;color:#ffcc00">. 破線の枠です .</font>. 点線の枠です .<font style="border:dotted 4px;color:#339933">. 点線の枠です .</font>. 盛上線の枠です .<font style="border:ridge 4px;color:#ff0000">. 盛上線の枠です .</font>. 窪み線の枠です .<font style="border:groove 4px;color:#ff7f50">. 窪み線の枠です .</font>. 盛上の枠です .<font style="border:outset 4px;color:#4b0082">. 盛上の枠です .</font>. 窪みの枠です .<font style="border:inset 4px;color:#20b2aa">. 窪みの枠です .</font>
2012.11.19
コメント(0)
-
練習（2012.11.19）1
ちょっと前にやったことですが、HTLMコードをちゃんと大文字の“＜＞”でなくちゃんと小文字の“”を表示できるようになったたので、書き直してみました。☆横罫線 ＜ＨＲ＞ ※線の色. ：color= ･････ 色名 ・ RGB値(6桁) ※線の幅. ：width= ･････ パーセンテージ（％） ・ 整数値（ピクセル数） ※線の配置：align= ･････ “left"（左揃え） ・ "center"（中央揃え） ・ "right"（右揃え）<hr size="1"><hr size="0" color="red"><hr size="1" width="70%" color="008000"><hr size="4" width="300" color="green" align="right">
2012.11.19
コメント(0)
-
“＜＞” の記号を “<>” で表示出来るようになりました。
HTMLのコードをそのまま表示できなかったのですが、表示できる方法がわかりました。今まで、半角文字の“”を全角文字の“＜＞”に変える事で何とか表示していました。ただ、“”を“＜＞”に替えるよりもっと大変になりそうです☆半角文字"< >"を表示させる半角文字の 「＜」 と 「＞」 はHTMLでタグの一部と解釈され、タグの表示できないので半角文字の 「＆◎◎；」 という形式で記入します半角文字で･･･ 「＜」 を 「＆ｌｔ；」 に書き換える 半角文字で･･･ 「＞」 を 「＆ｇｔ；」 に書き換える記入例★文字に下線を引く ＜Ｕ＞････････＜/Ｕ＞ 文字に下線を引きます <U>文字に下線を引きます</U> ＆lt;U＆gt;文字に下線を引きます＆lt;/U＆gt;（上記のように記述すると小文字の“＜＞”に変換されます。ただし、全角の「＆」が表示されてますが半角文字の「&」を使用してください）★文字に削除線を引く ＜Ｓ＞････････＜/Ｓ＞ 文字に削除線を引きます <S>文字に削除線を引きます</S> ＆lt;S＆gt;文字に削除線を引きます＆lt;/S＆gt;（上記のように記述すると半角文字の“＜＞”に変換されます。ただし、全角の「＆」が表示されてますが半角文字の「&」を使用してください）★文字の色を変える ＜ＦＯＮＴ ＣＯＬＯＲ＝""＞････････＜/ＦＯＮＴ＞ 文字の色は赤です <FONT COLOR="FF0000">文字の色は赤です</FONT> ＆lt;FONT COLOR="FF0000"＆gt;文字の色は赤です＆lt;/FONT＆gt;（上記のように記述すると半角文字の“＜＞”に変換されます。ただし、全角の「＆」が表示されてますが小文字の「&」を使用してください）
2012.11.19
コメント(0)
-
うちの猫ちゃんを以前に撮った写真です
うちの猫ちゃんを以前に撮った写真です。ほんといつも眠そうにしているのですよ。最近は炬燵の中で気持ちよさそうに寝ています。気持ちよさそうに、ぐっすりと･･･ﾆｬ～ﾝ♪
2012.11.18
コメント(0)
-
自由欄の文字のスクロールを
☆＜MARQUEE＞ 縦（下から上）にスクロール猫とバドミントンが好きです。（ すきなバドはまだできない状態…(- -;) ）気づいたこと思ったことを忘れないように書いていこうとまだまだ少々暗いこと一人よがりのことおなじようなことばかりかもしれませんが・・＜MARQUEE direction=up height=100 scrollamount=2 ＞＜center＞＜font size="3" color="9400cc"＞猫とバドミントンが好きです。＜/center＞＜/font＞＜font size="1" color="#000000"＞＜center＞（ すきなバドはまだできない状態…(- -;) ）＜/center＞＜/font＞＜font size="3" color="#333ccc"＞＜center＞気づいたこと＜/center＞＜center＞思ったことを＜/center＞＜center＞忘れないように書いていこうと＜/center＞＜center＞まだまだ＜/center＞＜center＞少々暗いこと＜/center＞＜center＞一人よがりのこと＜/center＞＜center＞おなじようなこと＜/center＞＜center＞ばかりかもしれませんが・・＜/MARQUEE＞＜/center＞＜/font＞ごちゃごちゃとしていてわかりにくいですね。ＨＴＭＬコードを表示させるために、半角“” を 全角“＜＞” に全部？変えているので、すこし大変ですdirection="down" ･･･ 上から下へスクロール height ･･･ エリアの高さ scrollamount ･･･ 文字列が進むピクセル数
2012.11.18
コメント(0)
-
自由欄のネズミちゃんたちを
☆＜MARQUEE＞ 横（右から左）にスクロール........＜MARQUEE direction=left width=566 scrollamount=3＞＜img src="http://image.space.rakuten.co.jp/lg01/39/0000670039/86/img9b3352ebzikbzj.gif" width="31" height="31" alt="ｱｲｺﾝ02" border="0"＞........＜img src="http://image.space.rakuten.co.jp/lg01/39/0000670039/85/img9b5aa321zikczj.gif" width="20" height="20" alt="ｱｲｺﾝ01" border="0"＞＜/MARQUEE ＞direction="right" ･･･ 左から右へスクロール width ･･･ エリアの幅 scrollamount ･･･ スクロール速度
2012.11.17
コメント(0)
-
以前挑戦していたものも
ほとんど覚えていないので、もう一度確認の意味でもと。すぐに忘れてしまうのですが、ずっと挑戦することはいいことだろうから。☆横罫線＜hr size="1"＞＜hr size="0" color="red"＞＜hr size="1" width="70%" color="008000"＞＜hr size="4" width="200" color="aqua" align="right"＞
2012.11.17
コメント(0)
-
少しずつ挑戦してみようかなと。
☆ルビーをふる出来(でき)たかな？ . ＜center＞ ＜font size="2" color="008080"＞ ＜ruby＞ ＜rb＞出来＜/rb＞ ＜rp＞(＜/rp＞ ＜rt＞でき＜/rt＞ ＜rp＞)＜/rp＞ ＜/ruby＞たかな？ ＜/font＞ ＜/center＞ 何とか結果が表示されましたが、ルビーをふった文字と後の文字が離れてしまいました。何か間違っているのでしょうか？なんとかしてＨＴＭＬの記述を載せようとしたのですが、ルビーをふった結果がへんてこな表示をされ内容がまったく載せられませんでした。でも半角“”を全角“＜＞”に変更したら、何とか表示されるようになりました。
2012.11.17
コメント(0)
-
時期が来ると・・・
植物って、時期が来るといつの間にか芽が出て、どんどん大きくなるんですよね。何年も見ているんですが、何もしないのに、同じ場所に毎年生えてくるんです。見ているだけで元気付けられます。今は、水仙の葉がどんどん伸びています。 → 2012.10.22 → 2012.11.16 2012.11.16
2012.11.16
コメント(0)
-
自分の癖？
ふと考えることを、なぜか悪い方へと考えをつないでしまう癖。いつのころからか、いつの間にかそんな風に考え込んでしまっていた。いつも思い悩んでばかりいた自分が嫌で嫌でしょうがなかったんです。考えないようにしても何故か考えてしまって･･･でも、最近は忘れて？しまうんですよ。嫌なことや良いことまでも･･･何か助かったような、残念なことのような？？今まで、ずっと抜けなかった苦しい思いが遠い昔のような感じでほとんど思い出さなくてすむんです。これでホッとできてよかったと思っていたのですが、その代わりに、記憶することが難しくなっているんです。これも深刻な問題。でもそれすら、どこか遠いことのような感じなんですね。一難さってまた一難。難しいですね。
2012.11.15
コメント(0)
-
炬燵のヒーターを交換しました。
去年から、炬燵の手元コントローラーのＳＷの調子？がおかしくなり、最高温度にしても最低温度のままの時が多々あり、寒さを感じていました。手元コントローラーを探したのですが製造メーカーに問い合わせするしかなく、年数もかなり経っていたのであきらめていました。でも、暖かくなるときもあったので、去年からどうしようかと考えていました。だんだん寒くなってくると、暖かさが安定しないことは、だんだん憂鬱になってきたので、何とかしなくてはと思っていたら、ホームセンターの広告でユニットーヒーターが販売されていることを知り、手元コントローラーのことばかりを考えていて、ヒーターごと交換すればいいんだという発想がなかったんです。“なーんだ”という感じです。あちこちを探してみたら、予定よりはいくらか安く購入でき、今日取り替えたのですが、自分でも交換出来て、良かったと思いました。それに暖かさが全然違います。これで、寒くなっても安心！？かなと。今日は、２年ぶりにバドミントン仲間だったＥさんとばったり会って、いろいろ話をしました。話を聞いていると、いろんな大変だったことをサラッと笑顔で話しているＥさんに見習わなくっちゃと昔と同じような思いになりました。彼女みたいになりたいとずっと思ってきたのですが、どうしてか反対な方向ばかりに・・・。
2012.11.06
コメント(0)
全25件 (25件中 1-25件目)
1
-
-
- 【楽天ブログ公式】お買い物マラソン…
- お買い物マラソン☆3〜5店舗目 ゼビオ…
- (2026-08-11 08:00:04)
-
-
-
- ビジネス・起業に関すること。
- 人と違うことをしろ！
- (2026-08-11 08:16:19)
-
-
-
- 避難所
- 【防災用品】‐「家具転倒防止」‐「防…
- (2026-06-06 03:46:40)
-
