ResizeObserver - Web API | MDN
resize-observer-text.html （ソースを参照）の例では、スライダーの値が変更され、それを含む <div> の幅が変更されると、リサイズオブザーバーを使用してヘッダーと段落の font-size を変更します。これは、ビューポートに影響がない要素のサイズの変化にも応答することができることを示しています。 また、オブザーバーをオフやオンにするためのチェックボックスも用意しています。オフにすると、 <div> の幅が変化してもテキストは変化しません。 JavaScript は次のようになります。 const h1Elem = document.querySelector("h1"); const pElem = document.querySelector("p"); const divElem = document.querySelector("body > div");
:only-child - CSS: カスケーディングスタイルシート | MDN
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 の基本的な理解度 評価課題: 素敵なレターヘッドの便箋の作成 評価課題: かっこいいボック
import - JavaScript | MDN
This feature is well established and works across many devices and browser versions. It’s been available across browsers since May 2018. Learn moreSee full compatibilityReport feedback 静的な import 宣言は、他のモジュールによってエクスポートされた読み込み専用の動的バインドをインポートするために使用します。インポートしたバインドは、バインドをエクスポートしたモジュールによって更新される一方、インポートしているモジュールによって再割り当てすることができないために、「動的バインド」と呼ばれています。 ソースファイルの中で import 宣言を使用するためには、ランタイムがそのファイルをモジュールと見なす必
Document: cookie プロパティ - Web API | MDN
上記のコードで、 newCookie は key=value の形式の文字列であり、クッキーを設定したり更新したりします。なお、この方法を使用して一度に設定・更新できるクッキーは、一つだけです。次のことも考慮してください。 オプションとして次に挙げる値を設定することができます。 key と value のペアの後にセミコロンで区切って設定することで、クッキーを設定・更新することができます。 ;domain=ドメイン (例えば、 example.com または subdomain.example.com): クッキーが送信されるホストです。 指定されなければ、これは現在の文書の場所のホスト部分を既定とし、クッキーはサブドメインでは利用できません。 ドメインが指定されれば、サブドメインも常に含まれます。 初期の仕様とは対照的に、ドメイン名の前のドットは無視されますが、ブラウザーはその様なドット
何が間違っている? JavaScript のトラブルシューティング - ウェブ開発を学ぶ | MDN
完全な初心者はこちらから!ウェブ入門ウェブ入門基本的なソフトウェアのインストールウェブサイトをどんな外見にするかファイルの扱いHTML の基本CSS の基本JavaScript の基本ウェブサイトの公開ウェブのしくみHTML — ウェブの構造化HTML概論HTML 入門HTML を始めようヘッド部には何が入る? HTML のメタデータHTML テキストの基礎ハイパーリンクの作成高度なテキスト整形文書とウェブサイトの構造HTML のデバッグ手紙のマークアップコンテンツのページの構造化マルチメディアと埋め込みマルチメディアとその埋め込みHTML の画像動画と音声のコンテンツobject から iframe まで — その他の埋め込み技術ウェブへのベクターグラフィックの追加レスポンシブ画像Mozilla のスプラッシュページHTML 表HTML 表HTML の表の基本HTML 表の高度な機能とア
Basic concepts of flexbox - CSS: Cascading Style Sheets | MDN
CSS Tutorials CSS basics CSS first steps CSS first steps overview What is CSS? Getting started with CSS How CSS is structured How CSS works Assessment: Styling a biography page CSS building blocks CSS building blocks overview CSS selectors Type, class, and ID selectors Attribute selectors Pseudo-classes and pseudo-elements Combinators Cascade, specificity, and inheritance Cascade layers The box mo
d - SVG: スケーラブルベクターグラフィック | MDN
SVG: スケーラブルベクターグラフィック チュートリアル Introducing SVG from scratch 概要 始めましょう 配置 基本図形 パス 塗りつぶしとストローク SVG におけるグラデーション パターン テキスト 基本的な変形 クリッピングとマスク SVG におけるその他のコンテンツ フィルター効果 SVG フォント SVG の image 要素 SVG のツール SVG と CSS リファレンス 要素 <a><animate>animateMotionanimateTransformcircle<clipPath><cursor> 非推奨 defs<desc>ellipse<feBlend><feColorMatrix><feComponentTransfer><feComposite><feConvolveMatrix><feDiffuseLighting><fe
object-fit - CSS: カスケーディングスタイルシート | MDN
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 の基本的な理解度 評価課題: 素敵なレターヘッドの便箋の作成 評価課題: かっこいいボック
Event reference | MDN
Events are fired to notify code of "interesting changes" that may affect code execution. These can arise from user interactions such as using a mouse or resizing a window, changes in the state of the underlying environment (e.g. low battery or media events from the operating system), and other causes. Each event is represented by an object that is based on the Event interface, and may have additio
Adding captions and subtitles to HTML video - Web media technologies | MDN
In other articles we looked at how to build a cross browser video player using the HTMLMediaElement and Window.fullScreen APIs, and also at how to style the player. This article will take the same player and show how to add captions and subtitles to it, using the WebVTT format and the <track> element. In this article, we will refer to the Video player with captions example. This example uses an ex
JavaScript 言語概要 - JavaScript | MDN
JavaScript チュートリアル 初級編 JavaScript の基礎 JavaScript の第一歩 JavaScript の構成要素 JavaScript オブジェクト入門 JavaScript ガイド 入門編 文法とデータ型 制御フローとエラー処理 ループとイテレーター 関数 式と演算子 数と日付 テキスト処理 正規表現 インデックス付きコレクション キー付きコレクション オブジェクトを利用する Using classes プロミスの使用 JavaScript 型付き配列 イテレーターとジェネレーター メタプログラミング JavaScript モジュール 中級編 クライアントサイド JavaScript フレームワーク クライアントサイド Web API Language overview JavaScript のデータ構造 等値比較と同一性 プロパティの列挙可能性と所有権 クロ
JavaScript style guide - Mozilla | MDN
else は上で示したように常に単独の行に書いてください。 return の後には else を使わないでください。 if (x < y) return -1; if (x > y) return 1; return 0; i++ も ++i も使用可能です。 インライン関数はそのデバッグが楽になるように名前を付けてください。関数をプロパティに代入しただけではその関数に名前を付けることはできません。次のようにしてください。 var offlineObserver = { observe: function OO_observe(aSubject, aTopic, aState) { if (aTopic == "network:offline-status-changed") setOfflineUI(aState == "offline"); } }; 名前や列挙値には interCap
Places query URIs | MDN
この記事は place URI を生成するときに使用できるパラメータについて説明します。これらの URI は Places のクエリを実行します。 place URI をブックマークとして使用できます。例えば、ツールバーを右クリックして「新しいブックマーク」をクリックすると、そこに place URI を入力できます。それはツールバーに新しいクエリを生成し、クリックするとクエリーの結果を含むポップアップが現れます。 以下の place URI は Firefox 3を最初に起動したときに生成されるデフォルトのスマートブックマークセットの「よく見るページ」スマートブックマークを実現します。 place:queryType=0&sort=8&maxResults=10 このクエリで使用されているパラメータは以下のとおりです： queryType=0 これはクエリはユーザの履歴だけに適用されブッ
Mozilla Foundation
A Richer Web: SVG And Canvas In Mozilla Robert O'Callahan Lizard Engineer Today's Web Graphics CSS: text, rectangular boxes, border effects, opacity Images: JPG, translucent PNGs, animated GIFs Flash Creatively scripted combinations of the above The Problem You can't do this with just HTML/CSS! Demo (And Flash isn't really what you want here)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Demos of open web technologies | MDN
オープン Web テクノロジーのデモ | MDN
Mozilla Foundation