タグ別アーカイブ: CSS

CSSの作成メモ、忘れるといけないので書いておく

CSS

CSSの作成メモ、忘れるといけないので書いておく

CSSとかはあまり使っていないというか使う場面が見出しの飾り装飾くらいしかないので、あまり使っていません。でも、見出しが多くなると、やはり、装飾を入れないとページを一気にスクロールするときに見る側が読みにくいと感じるので、CSSで対応してみたいと思います。
以下は、メモです。間違って書いてるとか勘違いをしている箇所があると思います。
続きを読む

毎日描け、女性顔、ファッションモデル風女性|ソフトパステルかオイルパステルを使ってイラスを描いてみようか、紙とパステルの種類は|CSSでボタンの装飾、メモ、CSSを使ったお好みボタンを作る

CSSでボタンの装飾に関するサイトリンクメモ、CSSを使ったお好みボタンを作る

CSSなんて、設定がよくわからない人です。でもCSSが理解できないのではなくて、設定をどうすればよいのか、書籍やグーグルで調べもせずに、食わず嫌いな状態です。以前はJAVASCRIPTがそうでした。プロパティとかオブジェクトとか、”なんじゃそれ”、ブラウザがJAVASCRIPTの動作を保証していないし、セキュリティ上の問題もあるし、という状態で勉強しませんでした。でもUNITY(3Dゲーム開発環境)を使うようになって、プログラムコードやエラーの原因と解析をグーグルとか書籍とかで調べるようになると、JAVASCRIPTの一部を理解できるようになりました。ようはきっかけと参考になる資料とか教えてくれる人(サイト)なんですよね。

CSSもそんなものでしょう。ということで、参考になるサイトをメモします。
CSSのみで実装するボタンデザインやホバーエフェクト 20+α
というサイトがあります。
(以下、目次を引用してます。)

CSSのみで実装するボタンデザインやホバーエフェクト 20+α 目次

背景カラーをふわっと変更する
背景・ボーダー・文字カラーをふわっと変更する
背景カラーが左右に分かれていく
背景カラーが上下に分かれていく
文字間隔を広げる
背景を透過させ、ホバー時にうっすらと背景色を出す
ボーダースタイルを変更する
内側にブロックを表示する
上から背景がするっと降りてくる
左上から背景がするっと降りてくる
奥から背景をふわっと表示させる #1
奥から背景をふわっと表示させる #2
上からパタッと要素が落ちてくる
要素がパタッと開く
キューブ状にクルッと回転する
CSSのみでボタンデザイン #1
CSSのみでボタンデザイン #2
CSSのみでボタンデザイン #3
CSSのみでボタンデザイン #4
CSSのみでボタンデザイン #5
参考サイト
ジェネレータ

」(ここまで)

このサイトには、CSSでボタンの設定をするスクリプトが記載されていて、デモもあるので、CSSを使ったお好みボタンを作ることができます。グラフィックソフトを使ってボタンを作るのも良いですが、CSSで複数のバリエーションを作ったほうが良くなときもあると思います。
 CSSを使いこなせるようになるとこれはとても便利です。
 

毎日描け、女性顔、ファッションモデル風女性

続きを読む