CSS
・How to change address bar color in Firefox 143より From identifier to classPreviously, as outlined in the tutorial above, the declaration in your userChrome.css file that changes the background color was: #urlbar-background { background-…
・CSSグラデーションで日の丸が実装できるとは驚いた！ 日本の国旗をたった3行のCSSで実装するテクニック | コリス
・標準のHTML+CSSでスコープ化が可能に！ @scope入門 - ICS MEDIA https://ics.media/entry/250520/Firefox layout.css.at-scope.enabled −−＞ true 関連： ・CSS at-rule: `@scope` | Can I use... Support tables for HTML5, CSS3, etc https://caniuse.co…
・CSSグラデーションで日の丸が実装できるとは驚いた！ 日本の国旗をたった3行のCSSで実装するテクニック | コリス https://coliss.com/articles/build-websites/operation/css/japanese-flag-with-css-gradient.html 関連： ・cssで日の丸を描く方法 - nonb…
関連： ・Webサイトに絶対必要な単位（px、%、em、rem、vh、vw）！！の基礎をすごくわかりやすく解説 - YouTube
・Google Code-Prettify シンタックスハイライト
html に font-size: 62.5%; を指定するのはやめよう | Cherry Pie Webより フォントサイズにremを使用する際にいちいち計算をする必要はない。 :root { --root-font-size: 16; } p { font-size: calc( 13 / var(--root-font-size) * 1rem ); } CSSファイルに…
・2024年、現在の環境に適したリセットCSSのまとめ | コリス
まとめ：読みやすさはKPIに貢献し得る予備実験の結果から、文字と行間の大きさには適切な組み合わせに傾向があることがわかりました。すなわち、17px × 1.6を中心とした周辺の組み合わせが視覚的にバランスが良く、心理的負荷を下げたい場合はそれより文字を…
コーディングガイド by @mdo
日本人が想像するよりかなり広い範囲で日本語文字が中華フォント化している現象。CJK処理系における日本語の扱いに対する問題としてそろそろ何とかしていかないと、ソフトウェアの中の日本語が死んでいく危機感がある。そもそもなんでChineseに分類されるフ…
すべてのユーザーに対してインストールしておかないと、@font-face の src : local() でローカルフォントとして読み込めない引用元：【Windows】インストールした筈のフォントをCSSのfont-faceで指定してもローカルから読み込まれなくて悩む。 - freefielder…
日章旗 日の丸: cssカスタマイズより引用:◆radial-gradient()で描く ・html <div class="hinomaru1"></div> ・css .hinomaru1 { width: 300px; height: 200px; background-color: white; background-image: radial-gradient(circle closest-side,#be003f 60%,transparent 60%); border: 1p…
・CSSのaspect-ratioプロパティがすべてのブラウザにサポートされました、画像をアスペクト比で実装する今までとこれからの実装方法 | コリス 関連： aspect-ratioプロパティ
・Webアイコンフォントの【Font Awesome】がアカウント登録必須になったので、使い方をおさらいしました | Webクリエイターボックス
HTMLとその表示に必要なファイルをダウンロードする 「wget URL」でHTMLファイルをダウンロードできますが、通常は、HTMLからはスタイルシートや画像などがリンクされています。「-p」オプションを付けると、そのHTMLの表示に使用しているファイル、例えばス…
Webページを実装する際、そのページを表示するブラウザが各HTML要素にデフォルトでどのようなスタイルが適用されているか知っておくのは大切なこと。 ソ−ス：Chrome, Safari, Firefox, Edge 各ブラウザごとのデフォルトのスタイルシート、user agent stylesh…
ソ－ス：文字が描画されるまで - Qiita
上記をまとめると、以下の CSS ができ上がります。ご参考になれば幸いです。 body { /* フォントの種類 */ font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; /* フォントのサイズ */ font-size: 16px; /*…
Mac/Winで共通の日本語フォントがあります。游ゴシックと游明朝です。でもフォント名が微妙に違います。Mac/Winともに表示させるには、CSSに両方とも指定する必要があります。 ソ－ス：標準の日本語フォント / もうパンツはかない 関連： ・読みやすいフォン…
ベースラインとは文書内に配置されたプレーンテキスト(以下テキスト)の下に仮想的に存在する線です。テキストを打ちこむと、当然のように文字はその線上にキレイに並びます。 日本語と英語を打ちこんだテキスト しかし、英語の場合は小文字のgやy、j等、この…
・html + css で年賀状の宛名書き - adbird（広告鳥） 備忘録html+cssでのやり方には気が付かなかった。 関連： ・郵便番号の記入方法。枠にこだわらなくても良い | たまトラ・住所の記載省略は、どのようにすればよいのですか？ - 日本郵便
・画像解像度は「dpi」で表記され、1インチの中にどれだけのドット(点)を敷き詰めるかを表す ・画像解像度は印刷物を作成する時には高い方が鮮明に印刷できる ・Webページを表示させるディスプレイの解像度（dpi）は製品によって異なる ・解像度が高くなると…
「Rockridge- Layout-Variable Fontのデフォルト有効化はFirefox 62に延期された」でVariable Fontの存在を知った。・The Typekit Blog | バリアブルフォント – 柔軟なデザインを可能にする新しい種類のフォント・Variable Fontについて - console.blog(self…
昔のHTMLでの要素は大きく分けて『ブロックレベル要素』と『インライン要素』に分けられていましたが、HTML5ではこれら全て廃止となりました。 これはHTML側の管轄としての概念が廃止になったというだけの理由ですのでこれまで解説したとおりCSS側のレイアウ…
・CSSをハックしてパスワードを盗み取るキーロガーが登場 - GIGAZINE GitHub - maxchehab/CSS-Keylogging: Chrome extension and Express server that exploits keylogging abilities of CSS. https://github.com/maxchehab/CSS-Keylogging
使い方は簡単。CSSで次のプロパティーを設定するだけです。 .selector { font-feature-settings : "palt"; }このCSSプロパティーを使ったからといって全てのフォントで自動文字詰めができるわけではありません。利用できる条件は、OpenTypeフォントであるこ…
強調を表すタグ ... は強調（emphasis）を表します。 ... も強調ですが，em より強い強調を表すのが一般的です。デフォルトでは em は斜体，strong は太字になります。ただし，日本語を機械的に斜体にしたものは見苦しい上に，ブラウザによっては日本語は斜…
・[CSS]フッタを最下部に表示する5つのテクニック-コンテンツ量が少ない時は最下部に、多い時は成り行きに | コリスHTML <body> <div class="content"> コンテンツ </div> <footer class="footer">フッタ</footer> </body>CSS .content { min-height: calc(100vh - 50px); } .footer { height: 50px; }
・もし、HTMLのテキスト周りでデザイナーからこんなお願いをされたら... - Qiita 「日本語、文字詰めできないかな？ほら、このカタカナとかキモい。。」 「あ、欧文フォントがリガチャしちゃってるんだけど、外してくれないかな？」 「ここのpタグ？のところ…
