こんばんわ。たいそん(@ttaison)です。 今日はcss疑似クラスのお話。 代表的な疑似要素に:beforeや:afterなんてものがありますが、今回は:is()という 疑似クラスについて書いてみたいと思います。 :is()疑似クラスとは？ そもそも:is()は以前にあった:any :matchesが改名されたクラスになっており、用途は基本的に一緒。 どんな機能をもっているかについては、MDN […]
こんばんわ。たいそん(@ttaison)です。 これまでずっと、一人でweb制作してきたので正直あまり気にならなかったのですが、 チームで仕事をすることも視野に入れると気になってくるのが、コードの書き方。 とくにcssは、記法さえ守ればどんな書き方も出来てしまうので、誰かが書いたコードを他の人が見たらものすごい見にくいコードになっているかもしれません。 それゆえ「いいクラス名を付けよう」と考えるこ […]
こんばんわ。たいそん(@ttaison)です。 だいぶ間の空いた投稿となってしまいました、、、 もはや文章を書くことを忘れてしまっていたかのごとく投稿が止まっていましたが、大丈夫。 生きております。 さて今回の記事ですが、皆さんホームページやブログのデザイン変更において、「カンタンに背景画像を重ねて表示したい」とか「背景を重ねて表示する方法が分からない」と思ったことありませんか？ cssの擬似要素 […]
こんばんわ。taisonです。 皆さん、見出しやキャッチコピーで大きな文字を扱うことってありますよね。 シンプルなデザインにどかーん！と欧文文字が入ってたりすると、それだけでブランドイメージを伝えるのも難しくありません。 （まあ欧文使ったwebサイト作ることって、実際は少ないですけど） けど、大きな文字をwebで扱うのって意外とむずかしいし度胸がいります。 なんせweb上のフォントはＤＴＰと違って […]
こんばんは！taisonです。 ここのところ構成考える仕事が多く、あまりcssに手をつけていませんでした 汗 気を取り直して更新していきたいと思います！ さて、今回はおしゃれなサイト制作にはうってつけな、あるcssをご紹介したいと思います。 photoshopやillustratorでお馴染みのブレンドモードをcssで表現 皆さんphotoshopやillustratorを使ってデザインする時、ブ […]
こんばんわ。たいそん(@ttaison)です。 最近胃の回復が追いつかなくなってきた30代のtaisonです。 そろそろ食生活を考えねばならぬ歳になってきたようです。 このままでは右肩下がりになってしまうのでそれだけは避けねば、、、 さて、今日は形だけでも右肩上がりに！cssアニメーションでおなじみのtransform :rotateを使って、背景を斜め線に区切るレイアウトに挑戦してみようと思いま […]
こんばんわ。たいそん(@ttaison)です。 皆さんもうゴールデンウィークに入った頃でしょうか？ 私も休みに入り、色々とやりたいことや消化したい事をこなしたい衝動に駆られております、、、！ 楽しい連休にしたいですね、、、！ さて、話を戻しまして今日はアイコンフォントでおなじみのfont-awesomeについて。 サラッと導入できるけど意外とハマるfont-awesome 実務でもよく使う(つーか […]
