セカヤサブログ世界で一番初心者に優しいWeb制作のメディア。HTML/CSS/JavaScript、WordPress、Web制作の考え方を解説します。Generation)機能が搭載されていますよね。translateX(-50%);などという馬鹿げた記述をするなこんにちは。今回はよく紹介される中央揃えテクニックについて思うところがあったので、最新の中央揃えを解説します。translateX(-...2024.06.26HTML/CSSを学ぶHTML/CSSを学ぶ【コピペ可】文字数制限のかかったいい感じのtextareaを作る方法こんにちは。今回はtextareaタグをいい感じにする方法を紹介します。それが分かりやすいように右下に表示をします。制限文字数を超えると赤くなってユーザーが気づきやすくしています。absoluteなし】一見重なっている要素をlinear-gradientで解決するこんにちは。今回は、デザイン上の見た目は要素が重なっているように見える要素をスマートに実装する方法を解説したいと思います。absolute;を使った実装法がまず思いつくと思いますが、posi...2024.05.05HTML/CSSを学ぶHTML/CSSを学ぶCSSの単位、vwはいつ使うべきか【おすすめの使い方を紹介】cm、mm、Q、in、pc、pt、ex、ch...と実は20以上の単位がCSSには存在します。いってもpxと%が使えれば概ね問題はありません。時々pxと%以外の単位を知っているとコーディング時にお得な時があります。今回はその中のvw...2024.04.10HTML/CSSを学ぶHTML/CSSを学ぶCSSの単位、emはいつ使うべきか【おすすめの使い方を紹介】CSSにはいろんな単位がありますよね。pxと%に始まり、ある程度見かけるem、rem、vw、vh、ほとんど見かけないcm、mm、Q、in、pc、pt、ex、ch...と実は20以上の単位がCSSには存在します。いってもpxと%が使えれば概ね問...2024.04.10HTML/CSSを学ぶHTML/CSSを学ぶサイズが違うタイル状のレイアウトを自在に行う【grid-template-areas】こんにちは。今回はタイル状かつタイルのサイズが違う場合のスマートなコーディング方法を解説しようと思います。次のようなレイアウトです。Airbnbのサイトにあるレイアウトですが、最初の画像だけサイズが違います。これだけなら左右に要素...2024.01.12HTML/CSSを学ぶHTML/CSSを学ぶ【marginに別れを告げる】gapプロパティでスマートに余白を攻略するこんにちは。今回は余白について書いていきます。みなさんCSSにおいて余白といえばmargin、あるいはpaddingを思い浮かべるでしょう。要素と要素の間の余白はmarginを、要素の内側の余白にはpaddingを、というような使い分けを...2023.12.21HTML/CSSを学ぶHTML/CSSを学ぶ【徹底解説】もう迷わない!HTMLにおける画像サイズの決まり方を理解する【imgタグ】こんにちは。Webページ上に画像を表示させるにはimgタグを使いますよね。使ってみると結構サイズが思った通りになってくれずに困ったことも多いのではないでしょうか。いうわけで今回はimgタグのサイズの決まり方について細かくまとめて...2023.10.15HTML/CSSを学ぶHTML/CSSを学ぶ【効かない原因を完全解明】aspect-ratioの正体を暴くみなさんこんにちは。HTML/CSSにおいて、4:3や16:9など比率を維持した要素を作ることは長年の課題でした。秀樹フリーランス8年目|「世界一初心者に優しい」→セカヤサ。初心者が5年後も10年後も仕事を奪われない人になるための発信中。最新情報まとめWeb制作役立ちツールホーム検索トップサイドバ。