ういすぷのブログ
ういすぷの記録帳
タグ「CSS3」が付いた記事
( 8 件)
-
最近はロゴなどの単純画像をSVGで利用することが増えてきたのですが、テスト用サーバでうまく利用できませんでした。たとえば、DIVやBUTTONタグの背景「background-image:url()」の外部ファイルを指定したときに表示されない事がわかりました。CSSで背景の画像を指定すると、画像が表示されず変だなと調べてみました。ローカルでは表示できるので、サーバ上の画像を直接アクセスしてみたら、 [...]2018.08.20 -
CSS3に実装されています「Flexbox」についてのメモです。いままでIE11未満の対応などでfloatによるカラム分けをしていましたが、Windows XP/Vista などのサポートが切れたことにより、Flexboxを使っていけるようになりました。ちょっとしたことなのですが、メモとして残したいと思います。Flexboxの使い方使い方は簡単で、親要素に「display:flex;」と指定するだ [...]2018.07.09 -
「傍点（ぼうてん）」は文字の上や横に強調（注意）させるために○や●を付けたりする装飾（点）を言います。これが、CSSでやれる様になっていたのでメモします。Firefoxは対応していましたが、他は「ベンダープレフィックス」を付けて下さい。またIEはダメでした。ベンダーフレックスは次の通りです。＞Firefox-moz＞Google Chrome , Safari-webkit＞Opera-o [...]2017.02.12 -
ボタンなどマウスなどで選択させると、見た目上あまり美しくない場合があると思います。そこで、文字や画像を選択させない方法がCSS3にあります。次の様な選択（アクティブ）をさせません。該当する要素に「user-select:none;」を宣言します。CSS3では、ベンダープレフィックスという指定を行なわないと動作しない場合がありますので、次の様に指定するとモダンブラウザ（Web標準を十分に準拠ブラウザ [...]2016.12.02 -
CSS3を使って、文字をぶるぶる震わすメモです。こちらは、CSS3の@keyframesを使ったアニメーション処理になります。以下のソースをコピペすることで、CLASS「buru2」の要素がぶるぶる震えます。デモではDIV要素ですが、IMGのCLASS指定を行なえば、画像がぶるぶる震えます。強調するときにいかがですか。□ HTMLソール<div class="buru2">ブルブル&l [...]2016.10.04 -
オンラインゲームの「ファンタジーアース ゼロ 5th Anniversary」の特設ページを見たところ、雪の結晶が舞い散るJavaScriptが動いていました。もしやと思いソースをみてみたところ、私がカスタマイズした内容が使われていました。この雪が降る効果は、jQueryのSnowfall Pluginをカスタマイズしたものです。そのカスタマイズした内容の記事はこちらです。jQueryのSnowf [...]2011.12.22 -
秋ですし、楓を散らせてみました。PCや表示する端末の性能によっては、重いかもしれません。この処理は、jQueryとSnowfall Pluginをカスタマイズして行っています。カスタマイズ内容は、こちらの「jQueryのSnowfall Pluginで、複数の画像を利用できるようにしてみました。」ページで紹介しています。■ 設定/オプションソースは以下の通りです。画像のファイルはフルパスで指定でき [...]2011.11.04 -
先日「jQueryとSnowfall Pluginで桜をちらせてみました。」ページで紹介しました、JavaScriptライブラリとプラグインを利用した桜吹雪ですが、ブログコメントにCSS3を利用して、回転をかけることができるソースを紹介していただいたので、改良を加えてみました。※ CSS3を利用していますので、対応ブラウザ(Firefox3.6.12で確認)が必要となります。無くても動作しますが、 [...]2010.12.10