1行追加でOK！CSSだけで画像をトリミングできる「object-fit」プロパティー
2024年8月19日 CSS 画像の一覧を表示する時などは、画像のサイズが統一されていると並べて表示させてもすっきりキレイに整って見えますが、必ずしもサイズが同じとは限りません。かといってPhotoshopを使ってすべての画像をリサイズできない…ということもあるでしょう。そんな時はCSSでトリミングすると楽です！今回は「object-fit」というプロパティーを使って、画像の縦横比を保ちつつトリミングする方法を紹介します。 ↑私が10年以上利用している会計ソフト！ 画像を中央の位置でトリミングする まずはこの縦長の画像、横長の画像を並べ、縦横250pxの正方形の形で表示させてみましょう。 img { width: 250px; height: 250px; } CSSでこのように画像に対してサイズを指定すると… こんな感じでグチャッとつぶれて表示されちゃいます…。 そこで画像に対して ob
【100万PV達成】雑記ブログでアクセス（PV）アップする方法を全て教える｜今日はヒトデ祭りだぞ！
レールの上からこんにちは。☆←ヒトデです というわけでサラリーマンをしながら月間100万PV達成しました www.hitode-festival.com うだうだしてるうちに11月になってしまいましたが、7月全体でも100万PV、８月は落ちて90万PVでしたが、9月10月は100万PVに戻りました（10月は120万PVでした） 2017/3月追記。相変わらず100万ＰＶキープ出来ています。1月にはお正月効果もあって158万ＰＶまでいきました！ これを見て 嘘乙！ って人もいると思うけど、まあ、そう思うならそれで良いと思う 特に何かを売りつける気は無いし、サロンへの勧誘もしません。ちなみにここに来るまでサロン等には結局１つも入りませんでした 必要な情報は基本的に全部インターネットに無料で落ちてました この記事がそんな情報の１つになれば幸いです というわけで書いていきまーす あくまで「ブログ」
「ユニコード」で予期せぬ目に遭った話 - moriyoshiの日記
自分の知らないCJK Ideographのバリエーションがまだあったことに戦慄している pic.twitter.com/kUlyRLDDTM— moriyoshit (@moriyoshit) March 9, 2017 などというツイートをしたところ、思ったより反響があったのでまとめておく。 上記ではあいまいに「バリエーション」などと書いたが、Unicodeとそれを扱う環境においては、バリエーションと一口に言っても次のような状況がある。 意味論的に等価な異なる字形の集合 同じ字形で異なるコードポイントの集合 aは結構なじみ深いと思う。 a-1. 異なるコードポイントにそれぞれ異なる字形が割り当てられているもの 例: 「東」(U+6771) ⇔「东」(U+4E1C) 「斉」(U+6589) ⇔「齊」(U+9F4A) 「高」(U+9AD8) ⇔「髙」(U+9AD9) a-2. 同じコードポイ
【必見】はてなブログ初心者が初記事を書くまでにやった事まとめ - それは仕様です。
はじめまして、やんです。 都内でSEをやってます！ 様々な人との交流したり、自分で情報を発信したい！と思ってはじめてました。 初投稿記事になりますが、僕がこの記事を書くまでに行った環境整備やカスタマイズをまとめてみました。 僕のような、はてなブログ初心者の方の参考になればいいなぁー Twitterのフォローお願いします！ 【2017年4月】たった5記事でGoogleAdSenseの審査を合格した方法とは？ はてなブログにBootStrapを使ってグローバルナビゲーションバーを設置するよ！ はてなブログでお問い合わせ・プライバシーポリシーを設置して「noindex」にする手順まとめ Follow @yan_tzn 2017年3月25日 記事一覧のウィンドウ幅の縮小による、サムネイル表示領域が記事の概要説明表示領域を圧迫していたので、ウィンドウ幅に合わせてサムネイル表示を一定の大きさに表示する
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
