ハイパーいわんのブログ一覧

新スタイルシートが適用されてから
カウンタなどが表示できずに沈んでいましたが
ようやく復旧させることができました。

ごらぁ～してはなりません。

佛心が大切です(^^ゞ

あ～めんどうくさ～～

すんません・・・
再工事中です。

修正完了しましたが、見えますか？
右上です。

先日から調子が悪かったチョロＱシフトインジケータですが
4速、5速の時に一番左の白LEDチョロＱが光るはずが点滅しはじめました。

電源ラインかGNDラインかが悪いのかと思ってまずはGNDラインの配線を
見直しましたが、結果変わらず。

ついに点滅もしなくなったのでバラしました。

結局はLEDの寿命だったようです。
まだ1年も経ってないのに(^^;

ということで現在は暫定でブルーLED（イナズマ仕様）となっていますので
ヘッダーとフッターの画像も変更しました(^^ゞ

ちがい、わからないって(笑)

スタイルシート講座は前回の背景画に続いて第6回です。

◆カーソルの変更
cursor: cursorマウスを乗せたときのマウスカーソルの形状を指定します。
BODYやAといった要素のセレクタとしてcursor属性の値を
指定してみましょう。

ちなみに私は

A
{
・・・
cursor:help;
・・・
}
としています。
また好きな画像を指定することも可能です。
他のサイトにカーソル様の画像がある事が前提ですが。

cursor:url('http://***.cur');

下記の値の指定ができます。
auto（規定値：自動）
crosshair（十字印）
default（通常のもの）
pointer（ポインタ）
move（移動用）
e-resize（右リサイズ）
ne-resize（右上リサイズ）
nw-resize（左上リサイズ）
n-resize（上リサイズ）
se-resize（右下リサイズ）
sw-resize（左下リサイズ）
s-resize（下リサイズ）
w-resize（左リサイズ）
text（テキスト選択）
wait（待ち）
help（ヘルプ）
inherit （継承）
url('http://')URL指定

◆スクロールバーの変更

scrollbar-base-colorで黒(black)系とか赤(red)系とか一度に指定が可能です。
BODYの中に記述します。
BODY
{
・・・
scrollbar-base-color:black;
・・・
}

また個別に詳細な設定もできます。
scrollbar-track-color:背景
scrollbar-face-color:バーの表面
scrollbar-shadow-color:影の部分
scrollbar-darkshadow-color:3D影の部分
scrollbar-highlight-color:ハイライト部分
scrollbar-3dlight-color:3Dのライトカラー
scrollbar-arrow-color:矢印の色

色は基本16色を指定したほうが無難です。
Blackでも#000000でもどちらでも可で
Blackは大文字・小文字の区別もありません。

Black (#000000)
Gray (#808080)
Silver (#C0C0C0)
White (#FFFFFF)
Red (#FF0000)
Yellow (#FFFF00)
Lime (#00FF00)
Aqua (#00FFFF)
Blue (#0000FF)
Fuchsia (#FF00FF)
Maroon (#800000)
Olive (#808000)
Green (#008000)
Teal (#008080)
Navy (#000080)
Purple (#800080)


これまで説明して来た部分でかなりカスタマイズできましたよね！？



▼記事に満足したらここをクリック▼
ブログランキングランキングオンライン

こんばんは！

あっという間に2月も終わりとなりましたね！
我が家のインフルエンザもおかげさまでようやく治まって来ました。
私に移ってなければ・・・

まずはスタイルシート、前回の復習です。

B
{
color:Lime ;
font-size:20px;
line-height:130%;
}

という記述をすれば文字を選択して太ボタンを押せば
<b>文字</b>
と記述されてブログアップすれば
文字ってなっているはずです。

同じように斜とか下線についてもできます。
斜は前回説明したとおりで、下線は
U
{
color:red;
font-size:15px;
line-height:130%;
}
です。

今回は背景画像の指定の仕方について説明します。

background-image: url('http://***.jpg');

で指定します。
body
{
background-image: url('http://***.jpg');
}
と記述するとブログの背景画となります。

Vol.2でも説明しましたが

body {
background-image: url('http://***.jpg') no-repeat fixed 50% 50%;
}

repeatは背景画像の並べかたを
repeat（規定値：敷き詰める）
repeat-x（横方向のみ並べる）
repeat-y（縦方向のみ並べる）
no-repeat（ひとつだけ表示する）

attachmentは背景の動作を
scroll（規定値：一緒にスクロールする）
fixed（スクロールしない）

positionは
背景の横方向の位置を
left（左端）、center（中央）、right（右端）
または 50% のような割合で指定

縦方向の位置を top（上端）、center（中央）、bottom（下端）
または 50% のような割合で指定

fixedと一緒に指定すると見栄えもよくなります。
なお画像はスタイルシート用画像を使って指定すると簡単です。

bodyの他にspan や b や td にも適用できますので
試してください。ただし画像は小さめにしないとおかしな事に
なります(^^;

みんカラでは#Headerや#FooterというID属性も使えますので
そこへ記述するとヘッダーやフッターにも画像が入れられます。

.CalendarPlate中に指定するとカレンダの背景画を指定できます。

いろんなところにも指定できます♪

▼記事に満足したらここをクリック▼
ブログランキングランキングオンライン

こんにちは♪
火曜日の午後いかがお過ごしでしょうか？

我が家ではついにインフルエンザの魔の手が嫁にまで・・・
息子→娘→嫁と見事に伝染していっています。

残るのはみぃちゃんだけ・・・
私もやばいか(^^;

という事で、会社を密かに早退して帰ってきましたが
ぐっすりと二人とも寝てるので暇です(^^;

さて本題です。
今回は第4回となりますがいまいちまとまりがないですね(^^;

ブログ内で使える色とかフォントとか大きさとか太さとか
それを簡単に定義できるスタイルシートの書き方です。

基本的なものにclassっていうものがあります。
スタイルの定義はタグ単位、クラス単位で定義します。
クラス単位ではタグに依存しないスタイルが定義できますので
これを覚えましょう。

超簡単です。
自分が好きなクラスを定義できます。もちろん定義済みクラスにも
スタイルの適用ができます。

ではさっそく例を・・・

例えばブログ内で色を付けたいときがありますよね。
<font color="yellow">黄色<font>
と記述すれば黄色になります。

結局は同じことなのですが、スタイルシート内に
.y
{
color:yellow;
}
.b
{
color:blue;
}
.r
{
color:red;
}
.g
{
color:green;
}
という感じで記述しておくとブログ内で

<span class="yellow">黄色<span>
と記述すれば黄色になります。
<span class="yellow"><span>
の部分を辞書にたとえば"ｓ"で登録しておきましょう。

yの部分を変えるだけで色が替えられます。

もうひとつ便利な応用例として文字を強調させる太という
ボタンがありますよね！
これを押すと<b></b>が付きますよね。

これを利用しない手はありません。

B
{
color:Lime ;
font-size:20px;
line-height:130%;
}

って書いておくと太ボタンを押すだけで
太字＆サイズ大＆黄緑色になります。

斜というボタンを押すと<em></em>が付きますよね。

EM
{
color:yellow;
font-size:20px;
line-height:130%;
}
と書いておくと斜ボタンを押すだけで
斜字＆サイズ小＆紫色になります。

色や文字はご自分で好きなように替えてみてください。

ではまた続きは後日♪




でもカレンダーのところに<b></b>が使ってあるから
気をつけろ～～～

またな！


▼記事に満足したらここをクリック▼
ブログランキングランキングオンライン


ブログランキング