
【IE対応】CSSで画像をトリミングする「object-fit」まとめ
レイアウトのサイズに合わせ、出力する画像を複数用意する時代はもう終わりを告げた。 今は「object-fit」というウルトラ便利なcs...
レイアウトのサイズに合わせ、出力する画像を複数用意する時代はもう終わりを告げた。 今は「object-fit」というウルトラ便利なcs...
例えば以下のようにhtmlがあったとき、 idや要素自体にスタイリングするのはご法度とされています。 さてなんでダメなんでしょう...
コーディングしているとき、子要素の下にmarginをつけているのに、親要素の下側に余白ができない場面に遭遇したことはないでしょうか? ...
リンクを別タブで開くことのできる「target="_blank"(以下タブゲラ)」、つけるかつけないかについてはずっと意見が分かれていて絶え...
昨今、XDでWebデザインをするのがだいぶメジャーになってきましたが、イラストレーターでデザインをする人はまだまだ普通にいますので、コーダー...
「n番目の要素」という指定ができる":nth-child(n)"系の疑似要素ですが、注意しなければいけない点と、案外知られていない便利なバリ...
レスポンシブだけど、iPad(タブレット)ではPCの縮小表示にしたい。 最近、けっこうそれがスタンダードになってきている気がします。 ...
CSS設計、やってますか? 何も考えずに命名したりCSSを書いていると、拡張性や管理性を損なうとんでもないものが出来上がります。 作った...
cssのflexを使って、3列以上の幅が均等な要素を横並びにして左右にぴったりくっつけたい場合、以下のように記述すればOK。 ...
コーディングを始めたての頃は、レスポンシブでかなり苦戦すると思います。僕がWeb制作をやりはじめたころは、まだレスポンシブはそこまで一般的と...
電話番号をタップしたら電話できるようになる これですが、そのままだとPCでもクリックできちゃう。 実はSkype...
突然ですが、HTML5ではaタグの中にdivやsection等のブロック要素を入れてもいいということを知っているでしょうか。 HTML...
HTML/CSSコーディングは、ある程度慣れてくると、どうやって書けばこのデザインを実現できるかという思考から、どうやれば早く効率的に終わら...
意外と知られていない、上付き文字を表すためのhtmlタグ、<sup>。 例えば、 とすれば、 定価200円※ ...