在宅のお手伝いの仕事の関係で、CGIをいじったり、
htmlをいじったりしてます。
CGI(Perl)は正規表現のオンパレードで、チンプンカンプン。
もっぱらサポート掲示板のお世話になってます。
それよりは、まだ、htmlの方がいじりやすいです。
まだ、まだ、コピペ段階ですが、昨日は、input buttonをブリ
ンクさせたくて、ネットでたぐって、やっと、その方法がわかり
ました。
C言語等でいえば、サブ関数を書き入れて、それを呼び出す
イメージですね。
次の手順でできました。もちろん、0から作るのではなく、
動いているものを改変します。
1 <head>~</head>の記述を探す。
2 上記内でさらに
<style type=”text/css”>~</style>を探す。
3 さらに、を探す
4 3の部分に使いたいcssを追記する。
5 追記したもの
/* 点滅 */
.blinking{
-webkit-animation:blink 1.5s ease-in-out infinite alternate;
-moz-animation:blink 1.5s ease-in-out infinite alternate;
animation:blink 1.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
0% {opacity:0;}
100% {opacity:1;}
}
@-moz-keyframes blink{
0% {opacity:0;}
mcxaza100% {opacity:1;}
}
@keyframes blink{
0% {opacity:0;}
100% {opacity:1;}
}
6 効果を持たせたい部分を
<span class=”blinking”>
と
</span>
で囲む
これだけですが、理解するのに、半日以上かかりました。
CSSの記述は、htmlファイル内に記述する場合と、
*.cssという外部ファイルに記述して、取り込む場合と、
両方あるようですね。
外部ファイルの取り込みにも何種類かやり方があるようです。
この辺は、Cとは、ちょっと違いますね。
という訳で、やっと、目的の装飾(ブリンク)が達成できまし
た。
=追記=
<span class=”blinking”>は、ブログの編集画面で、
そのまま、書くと、スタイル?の一部と認識されて、
表示されなくなります。
「<」と「>」を半角で表記するには、それぞれ、
&ltと&gt
を使うようです。ちょっと、面倒ですねえ。