CSS3 transition

CSS3について勉強中です。今回も備忘録として書いています。

今回は「transition」を勉強しました。

JavaScriptを使わずに動的な演出ができるので、活用できるのではないかと期待しています。

「マウスホバーで文字が変化します」

覚えるべきは下記4つのプロパティ

「transition-timing-function」については下記の6つの値を覚えておく。

  • ease
  • linear
  • ease-in
  • ease-out
  • ease-in-out
  • cubic-bezier

マウスホバーで変化させるのが典型的なので、リンクタグと合わせて活用すると良い感じになる。

samplefish.jpg

この記事が参考になりましたら拍手をお願いします。管理人のモチベーションが上がります。m(_ _)m

CSS3 border-radius box-shadow

備忘用に記事を書いておきます。

他人のWebサイトの制作をたのまれてしまい、HTML5とCSS3を再勉強中です。

今のWebサイトのデザインはCSS3の知識が必須です。私の知識はCSS2.1で止まっているのでいろいろ試行錯誤しながらデザインしている段階です。

CSS3の中でも「bordar-radius」と「box-shadow」については使いこなせて当然というぐらい、必須のようです。

samplefish.jpg

画像のボーダーを丸や楕円にし、影をつけるだけで印象が変わってきます。

ちなみにテキストに影をつけるtext-shadow」というものもあります。

この記事が参考になりましたら拍手をお願いします。管理人のモチベーションが上がります。m(_ _)m

【雑記】 2017年1月の出来事

早いもので、2017年もあっという間に1ヶ月経過しました。

年末年始に忘年会やら親戚の集まりやらでインフルエンザにかかり、出だしの悪い2017年の始まりでした。

インフルエンザもさることながら、粉瘤(ふんりゅう)という皮膚の腫瘍ができてしまい、その除去手術をうけました。

粉瘤は簡単に言うと皮膚にできる良性腫瘍で、皮膚の組織の一部が袋状になって、角質の老廃物を溜め込んでいきます。

自分で皮膚の異変に気づいた時は直径1cm程度の小さなシコリでした。とくに痛くもかゆくも無いので放置してました。

気づいてからもう1年以上も経った、去年の暮れ頃にだんだんと大きく腫れてきて、さすがに医者に診てもらおうかと思い始めました。

インフルエンザを診てもらう機会のついでに皮膚の腫れを診てもらったら、粉瘤と診断され、除去するなら直ぐのほうがいいと言われたので、手術してもらいました。

皮膚を切開して腫瘍を取り出したのですが、直径8cm程のぶよぶよした脂肪の塊のようなものが出てきました。

麻酔していたとはいえ、痛みと流血とでつらかったです。手術は1時間半もかかりました。

皮膚を10cm程切開したので、縫合に7針縫って、2週間後に抜糸しました。

もし皮膚に小さなシコリができたら、痛みが無くても医者に診てもらいましょう。粉瘤であれば小さいうちに除去した方が絶対にいいです。

小さければ手術は10~20分程度で終わり、針で縫う事も無いようです。料金もだいぶ安くなります。

2017年の1月は病気に悩まされ、健康の大切さを感じました。今年は健康に気をつけたいと思います。

そして、健康の為に痩せようと思います。ダイエット記事をまた書くかもしれません。

この記事が参考になりましたら拍手をお願いします。管理人のモチベーションが上がります。m(_ _)m
ページ下部までご覧いただきありがとうございました。
プロフィール

Deka-E

Author:Deka-E

ブログ4年目のブロガーです。
HTML/CSSが理解できる程度で成長が止まってます。
JavaScriptはサッパリ分からんです。

カウンター
総閲覧者数:
現閲覧者数:
検索フォーム
ジャンル別リンク
★は相互リンクさせていただいています

RSSリンクの表示
カレンダー
01 | 2017/02 | 03
- - - 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 - - - -
Twitter
管理人Deka-Eのツイート
サイドバー2下の追尾スペース