うつ病WEBデザイナーがうつ病を克服するため独学で学んだことをアウトプットして共有するためのブログ

うつWEB

CSS

CSS WEBデザイン

Wordepressテーマ「Affinger5」や「Stinger8」のトップの記事一覧を追加CSSだけでグリッドレイアウトにしてみた話

2019/10/22  

記事一覧をグリッドレイアウトにしたかった wordpressテーマの affinger5(wing) や stinger8 を使ってるんですけど、基本デフォルトのまんまあまりいじらず使ってたんですが、 ...

CSS WEBデザイン

【html/css】サイトの高さが足りないときでもフッターを画面の一番下に固定したいときのHTMLとCSS【スマホでもOK】

2019/9/21    , ,

よくあるレイアウトで「ヘッダー」「コンテンツ」「フッター」という構成がありますよね。 ヘッダーは常に先頭にあるから問題ないけど、フッターはコンテンツの最下部に鎮座していてほしいのに、コンテンツの情報量 ...

animate.cssトップ画面

CSS iPhone WEBデザイン スクリプト

animate.cssでスクロールに合わせてアニメーション表示しようとしたらiPhoneで変な挙動になったけど解決したメモ

2019/10/1    , , ,

手軽にCSS3のアニメーション効果を導入できる「animate.css」って便利ですよね。導入も簡単だしアクションも面白いのでサイトにガンガン使いたい感じでいいです。 そこで、スクロールして表示された ...

font awesome トップ

CSS WEBデザイン スクリプト

無料でいろんなアイコンをWebフォントとして使える「Font Awesome」が便利だなーって話

2019/10/22    

https://fontawesome.com/ カタカナで書くと、フォントオーサム。僕の名前は皆川オーサム。普通のWebサイトではあまり使う場面はないかもしれませんが、スマホアプリやブラウザアプリや ...

CSS WEBデザイン

画像のゆっくりズームイン/ズームアウトはJavaScriptじゃなくてCSS3のアニメーション

2019/9/20    , ,

どうもWEBデザイナーやって約20年、皆川(@minagawa_osamu)です。 画像のゆっくりズームイン/ズームアウトはJavaScriptじゃなくてCSS3のアニメーション 当サイトのトップペー ...

CSS WEBデザイン

要素を画面のど真ん中に配置するCSS

2019/9/20  

テキストなり画像なりを横位置センターに配置するのは「text-align:center」で指定できますが、縦位置のセンターに配置するのは、いろいろ方法がありますがなかなか骨が折れる作業なので、比較的簡 ...

CSS WEBデザイン

【CSS】position:rerativeとposition:absoluteで自由なレイアウト

2019/9/20  

CSSで画像や要素を自由な位置にレイアウトしたいとき、 というよりも、最近は昔のようにHTMLの制約を気にせず自由なレイアウトばかりしてますが、 以下のCSSのおかげです。 <div style ...

Copyright© うつWEB , 2019 All Rights Reserved Powered by AFFINGER5.