古いリセットCSSからはもう卒業！ モダンブラウザに最適化された新しいリセットCSS -A (more) Modern CSS Reset
モダンブラウザをターゲットにしたWeb制作では、リセットCSS自体が必要ないかもしれません。とは言っても、設定しておきたいスタイルや一部のブラウザ用に設定しておきたいスタイルがあります。 現在のWeb制作に合わせて制作されたリセットCSSを紹介します。なぜそうするのか、なぜそれを使用しないのか、CSSの知見やテクニックも満載です！ A (more) Modern CSS Reset by Andy Bell 他のリセットCSSが気になる人は、こちらも注目です。 A (more) Modern CSS Resetの前のバージョンも解説しています。 2023年、現在の環境に適したリセットCSSのまとめ 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに モダンブラウザに適切なデフォルトのリセットCSS 各リセットCSSの解説
Chrome 127で追加された、CSSの新しい機能3つを紹介します。 今回のアップデートでは、使用するフォントに関係なく読みやすさを確保したり、生成コンテンツ内の代替テキスト、iframeでのビュー遷移のサポートなど、Web制作者は要チェックです！ New in Chrome 127 Chrome 127 beta 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 はじめに font-size-adjustプロパティ 生成コンテンツ内の複数引数の代替テキスト iframeでのビュー遷移のサポート はじめに 7/24にリリースされたChrome 127で3つのCSSの新しい機能が追加されました。対象となるChrome 127は、Android、ChromeOS、Linux、macOS、Win
WebKit Features in Safari 17.2
ContentsHTMLCSSImages and videoJavaScriptWeb APIWeb AppsWebGLPrivacyWeb InspectorFixes for Interop 2023 and moreUpdating to Safari 17.2Feedback Web technology is constantly moving forward, with both big new features and small subtle adjustments. Nowadays, web developers expect web browsers to update multiple times a year, instead of the once or twice a year typical of the late 2000s — or the once
Interop 2022、Interop 2023に続き、Interop 2024の取り組みがスタートした旨を知らせる記事が、参加組織それぞれから一斉に公開されました。 Interop 2024 | Blog | web.dev The web just gets better with Interop 2024 | WebKit Interop 2024 Launch - Bocoup Interop 2024 Launches | Igalia Microsoft Edge and Interop 2024 - Microsoft Edge Blog Announcing Interop 2024 - Mozilla Hacks - the Web developer blog 加えて、既にInterop 2024 Dashboardが公開されています。Interop 2023より引き
ウェブブラウザ「Google Chrome」の最新安定版であるバージョン127がリリースされました。フォントごとの見た目の大きさを統一できる「font-size-adjust」がサポートされたほか、ピクチャーインピクチャー機能の強化やスクロールバーを標準でキーボードからフォーカス可能にする変更が行われています。 New in Chrome 127 | Blog | Chrome for Developers https://developer.chrome.com/blog/new-in-chrome-127 New in Chrome 127: cross-document view transitions, CloseWatcher API re-enabled, and more - YouTube ◆CSSに「font-size-adjust」が追加される ユーザーの環境に
The Ultimate Guide to Font Performance Optimization | DebugBear
Font performance optimization is a set of web development techniques that make fonts load faster and render more smoothly. They involve practices such as thoughtful font selection, the use of performant font formats, self-hosting, optimized @font-face declarations, font display strategies, and more. Optimizing the fonts displayed on your website comes with many web performance advantages, includin
Interop 2024の中間アップデートなど: Cybozu Frontend Weekly (2024-07-16号)
こんにちは！サイボウズ株式会社フロントエンドエンジニアのsaku (@sakupi01)です。 はじめに サイボウズ社内では毎週火曜日にFrontend Weeklyと題し「一週間の間にあったフロントエンドニュースを共有する会」を開催しています。 今回は、2024/07/16のFrontend Weeklyで取り上げた記事や話題を紹介します。 取り上げた記事・話題 MySQLデータベースエンジンでJSをサポート データベースエンジン側にあらかじめまとまったクエリの処理などを登録しておき、必要に応じて呼び出すことでその処理を実行できるストアドプロシージャやストアドファンクションという機能の処理をJavaScriptで記述可能になります。 MySQLのデータベースエンジン側でJavaScriptを実行する機能を提供しているのはGraalVM上で実装されているGraalJSです。 以下のように、
CSS チュートリアル CSS の基本 CSS の第一歩 CSS の第一歩の概要 CSS とは何か CSS 入門 CSS の全体像 CSS の働き 評価課題: 経歴ページのスタイル設定 CSS の構成要素 CSS の構成要素の概要 CSS セレクター Type, class, and ID selectors Attribute selectors Pseudo-classes and pseudo-elements Combinators カスケードと継承 Cascade layers ボックスモデル 背景と境界 書字方向の操作 内容のはみ出し CSS の値と単位 CSS における大きさの指定 画像、メディア、フォームの要素 表のスタイル付け CSS のデバッグ CSS の整理 評価課題: CSS の基本的な理解度 評価課題: 素敵なレターヘッドの便箋の作成 評価課題: かっこいいボック
Chrome 127 betaの公開など: Cybozu Frontend Weekly (2024-07-09号)
こんにちは！サイボウズ株式会社フロントエンドエンジニアのdaiki（@k1tikurisu）です。 はじめに サイボウズ社内では毎週火曜日にFrontend Weeklyと題し「一週間の間にあったフロントエンドニュースを共有する会」を開催しています。 今回は、2024/07/09のFrontend Weeklyで取り上げた記事や話題を紹介します。 取り上げた記事・話題 React & Codemod Announcement React 19への移行を支援するツール（codemod）が公開されました。例えば、次の移行作業を自動化してくれます。 Context.ProviderをContextに置き換え forwardRefの削除 useContextをuseに置き換え next-cache-toolbar Next.jsのData Cacheの中身を視覚的に見れるツールです。 Diving
ContentsThe Interop ProjectInterop 2023Interop 2024The 2024 Focus AreasThe 2024 Investigation projectsTrack the progressOur Commitment The web is amazing. It makes collaborating, learning, and connecting easy for billions of people, because it’s intentionally designed to run on radically different devices. It’s your job as a web developer to ensure your project works in every browser and for every
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Chrome 127で新しく追加された3つのCSSの機能、使用するフォントに関係なく読みやすくするなど
Interop 2024がスタート | フロントエンドBlog | ミツエーリンクス
「Google Chrome 127」安定版リリース、フォントごとに見た目の大きさが変わる問題に対応
@starting-style - CSS: カスケーディングスタイルシート | MDN
The web just gets better with Interop 2024