css Google Chromeで画像を縮小表示するとぼやける現象をcss一行で解消する方法 レスポンシブデザインやRetinaディスプレイへの対策として、コーディングで画像を配置する際に通常想定しているよりも倍の大きさで画像を配置することはよくあると思... 2021.09.06 css
html 電話番号に自動で挿入されるリンクを無効にする2つの方法(Edgeにも対応します) ブラウザー側の操作で自動的にリンクが入る機能があるものもあります。たとえば、Microsoft Edgeや、iPhone、Androidなどスマートフォン向けの... 2019.11.08 htmlcss
css 【css】レスポンシブコーディングでボックスの横幅と高さの比率を維持しながら可変させる方法 レスポンシブ対応のコーディングでボックスの横幅と縦の幅の比率を一定に維持したいと考えたことはないでしょうか? 例えば、右に画像<img>、左にテキス... 2019.10.19 css
css cssのみでレスポンシブのスマートフォンサイズの時だけ電話番号リンクを有効にする方法 レスポンシブコーディングで、電話番号のリンクをあらかじめ追加しておくことはよくあると思います。目的はもちろんスマートフォンなど通話可能なデバイスでの... 2019.10.10 css
css 【css】画像(img)の下に余白(隙間)ができる問題を秒で解決する方法 html上にimg要素として画像を配置する際、画像の下にmarginやpaddingでは消せない余白ができてしまうことがあると思います。 今回はこ... 2019.09.12 css
css @font-faceで複数のweigthやstyleを持つWebフォントを定義する方法 Webフォントを@font-faceを使って指定することはよくあると思いますが、同じフォントで複数のfont-weightやfont-styleがある場合はどう... 2019.06.30 css
html レスポンシブでコーディングしたのになぜかスマホでうまく表示されない原因は? レスポンシブでコーディングしてPCでのテストはうまくいったのになぜか、スマホで表示されない。 こういった経験はありませんか? もしかしたらこの問題の... 2019.06.13 htmlcss
css もし、cssだけで最初の一文字目を指定するならfirst-letterが便利!ただし注意が必要です 文頭、最初の一文字の色を変えたり、大きくしたりといった手法のデザインは、よく見られると思います。 今回は、こういった表現をcssのみで実現できるのか?実現... 2019.06.10 css
css 最新版、レスポンシブデザインのブレークポイントはこれ! レスポンシブデザインのブレイクポイントというものは、明確に定義されているわけではないので、どこに設定するか悩むところですよね。 そこで、今回は、2020年... 2019.06.04 css
css 【css】transitionは動作時間だけじゃない!animationなしでここまでできる transitionと言えば、変化するまでの時間を指定する「transition-duration」で記憶されているかたも多いと思います。 ・コピペで使え... 2019.06.03 css