CSS

HTMLのrubyがイマイチと感じた時にCSSでフリガナを付ける方法

2023年1月24日

htmlにrubyってのがありますよね。漢字にフリガナを振ったりするアレです。でも、こいつがなかなかイマイチなやつで。。最近…つづきを読む

【CSS初心者向け】均等割付を使ってテキストを両端揃えにして綺麗にみせるサンプルコード

和文におすすめのtext-align : justifyを使った両端揃えにして綺麗にみせるサンプルコード

2020年12月25日

今回は、細かいけどサイトの印象を大きく左右するポイントのうちの１つ「テキストの端っこを綺麗に揃える」方法です。text-alig…つづきを読む

Flexを使用した間隔（マージン）をとった横並びレイアウトの指定方法まとめ【CSS初心者向け】

Flexを使用した間隔（マージン）をとった横並びレイアウトの指定方法まとめ【CSS初心者向け】

2020年5月22日

最近ではボックスの横並びレイアウトは、Flexを使用するのが一般的になってきています。いまさらな感じもする今回のタイトルです…つづきを読む

CSSでobject-fitを使わずに特定の縦横比に画像をトリミングする方法

CSSでobject-fitを使わずに特定の縦横比に画像をトリミングする方法

2019年1月30日

CSS初心者の方が「サイズがバラバラの写真をトリミングして縦横比を揃えて綺麗に表示したい」と思った時に、「CSS　画像トリミング…つづきを読む

広告

游ゴシックがIEで上にずれる時のCSSでの対応方法

2019年1月21日

游ゴシックって綺麗ですよね。このブログでも使用しています。ですが、游明朝も含む、游なんちゃら系のフォントをインターネットエクス…つづきを読む

埋め込みグーグルマップの縦横比を固定してレスポンシブ対応にする方法

2019年1月12日

お店や会社のアクセスマップをGoogleMapで設置するケースはとても多いと思います。個人で運営しているサイトでも、グーグルマッ…つづきを読む

CSSでセンタリングした複数行テキストの改行位置を揃えて綺麗に見せる方法

2019年1月9日

レスポンシブデザインが主流の昨今ですが、CSSでセンタリングしたテキストの改行位置って悩ましいものです。そのままだと、最後の行が…つづきを読む

スマホで画像が一瞬だけ大きく表示されてしまう場合のCSS修正方法

2018年7月22日

WordPressのテーマを使って作成している時によく起こる現象です。作成したページをスマホで見ると、アイキャッチ画像が一瞬ビヨ…つづきを読む

広告