@@ -51,7 +51,7 @@ This example shows the use of the `clear()` method.
Drop Zone
```
-#### CSS
+### CSS
```css
div {
@@ -67,7 +67,7 @@ This example shows the use of the `clear()` method.
}
```
-#### JavaScript
+### JavaScript
```js
function dragstartHandler(ev) {
@@ -121,7 +121,7 @@ function dragendHandler(ev) {
}
```
-#### Result
+### Result
{{EmbedLiveSample('Examples', 400, 300)}}
diff --git a/files/en-us/web/api/directoryentrysync/index.md b/files/en-us/web/api/directoryentrysync/index.md
index 50271f7cd41c8cb..dc6d00c2676774f 100644
--- a/files/en-us/web/api/directoryentrysync/index.md
+++ b/files/en-us/web/api/directoryentrysync/index.md
@@ -24,7 +24,7 @@ The `DirectoryEntrySync` interface represents a directory in a file system. It i
If you want to create subdirectories, you have to create each child directory in sequence. If you try to create a directory using a full path that includes parent directories that do not exist yet, you get an error. So create the hierarchy by recursively adding a new path after creating the parent directory.
-#### Example
+### Example
The `getFile()` method returns a `FileEntrySync`, which represents a file in the file system. The following creates an empty file called `logs.txt` in the root directory.
diff --git a/files/en-us/web/api/directoryreadersync/index.md b/files/en-us/web/api/directoryreadersync/index.md
index 287c8b78fb7c9c7..2abf87467bccdc6 100644
--- a/files/en-us/web/api/directoryreadersync/index.md
+++ b/files/en-us/web/api/directoryreadersync/index.md
@@ -20,7 +20,7 @@ The `DirectoryReaderSync` interface lets you read the entries in a directory.
Before you call the only method in this interface, [`readEntries()`](#readentries), create the [`DirectoryEntrySync`](/en-US/docs/Web/API/DirectoryEntrySync) object. But DirectoryEntrySync (as well as [`FileEntrySync`](/en-US/docs/Web/API/FileEntrySync)) is not a data type that you can pass between a calling app and Web Worker thread. It's not a big deal, because you don't really need to have the main app and the worker thread see the same JavaScript object; you just need them to access the same files. You can do that by passing a list of `filesystem:` URLs—which are just strings—instead of a list of entries. You can also use the `filesystem:` URL to look up the entry with `resolveLocalFileSystemURL()`. That gets you back to a DirectoryEntrySync (as well as FileEntrySync) object.
-#### Example
+### Example
In the following code snippet from [HTML5Rocks (web.dev)](https://web.dev/filesystem-sync/), we create Web Workers and pass data from it to the main app.
@@ -95,10 +95,6 @@ self.onmessage = (e) => {
};
```
-## Method overview
-
--
readEntries()
-
## Method
### readEntries()
diff --git a/files/en-us/web/api/document/cookie/index.md b/files/en-us/web/api/document/cookie/index.md
index 7967b7129ce84a7..55119fe9eedc2eb 100644
--- a/files/en-us/web/api/document/cookie/index.md
+++ b/files/en-us/web/api/document/cookie/index.md
@@ -379,7 +379,7 @@ The reason for the [syntax](#syntax) of the `document.cookie`
accessor property is due to the client-server nature of cookies, which differs from
other client-client storage methods (like, for instance, [localStorage](/en-US/docs/Web/API/Web_Storage_API)):
-#### The server tells the client to store a cookie
+### The server tells the client to store a cookie
```bash
HTTP/1.0 200 OK
@@ -390,7 +390,7 @@ Set-Cookie: cookie_name2=cookie_value2; expires=Sun, 16 Jul 3567 06:23:41 GMT
[content of the page here]
```
-#### The client sends back to the server its cookies previously stored
+### The client sends back to the server its cookies previously stored
```bash
GET /sample_page.html HTTP/1.1
diff --git a/files/en-us/web/api/element/mouseenter_event/index.md b/files/en-us/web/api/element/mouseenter_event/index.md
index 3ba518bff67423e..eebf573a445d5ed 100644
--- a/files/en-us/web/api/element/mouseenter_event/index.md
+++ b/files/en-us/web/api/element/mouseenter_event/index.md
@@ -95,12 +95,12 @@ _This interface also inherits properties of its parents, {{domxref("UIEvent")}}
Though similar to {{domxref("Element/mouseover_event", "mouseover")}}, `mouseenter` differs in that it doesn't [bubble](/en-US/docs/Web/API/Event/bubbles) and it isn't sent to any descendants when the pointer is moved from one of its descendants' physical space to its own physical space.
-#### Behavior of `mouseenter` events:
+### Behavior of `mouseenter` events:
![](mouseenter.png)
One `mouseenter` event is sent to each element of the hierarchy when entering them. Here 4 events are sent to the four elements of the hierarchy when the pointer reaches the text.
-#### Behavior of `mouseover` events:
+### Behavior of `mouseover` events:
![](mouseover.png)
A single `mouseover` event is sent to the deepest element of the DOM tree, then it bubbles up the hierarchy until it is canceled by a handler or reaches the root.
diff --git a/files/en-us/web/api/element/mouseleave_event/index.md b/files/en-us/web/api/element/mouseleave_event/index.md
index 3cfcf69794157be..158afb333a84d6e 100644
--- a/files/en-us/web/api/element/mouseleave_event/index.md
+++ b/files/en-us/web/api/element/mouseleave_event/index.md
@@ -91,13 +91,13 @@ _This interface also inherits properties of its parents, {{domxref("UIEvent")}}
- {{domxref("MouseEvent.y")}} {{ReadOnlyInline}}
- : Alias for {{domxref("MouseEvent.clientY")}}
-#### Behavior of `mouseleave` events:
+### Behavior of `mouseleave` events:
![](mouseleave.png)
One `mouseleave` event is sent to each element of the hierarchy when leaving them. Here four events are sent to the four elements of the hierarchy when the pointer moves from the text to an area outside of the most outer div represented here.
-#### Behavior of `mouseout` events:
+### Behavior of `mouseout` events:
![](mouseout.png)
diff --git a/files/en-us/web/api/fileentrysync/index.md b/files/en-us/web/api/fileentrysync/index.md
index 007b1e942d7e496..298dbf57a89362c 100644
--- a/files/en-us/web/api/fileentrysync/index.md
+++ b/files/en-us/web/api/fileentrysync/index.md
@@ -77,15 +77,15 @@ Returns a File that represents the current state of the file that this `FileEntr
void file ();
```
-##### Parameter
+#### Parameter
None.
-##### Returns
+#### Returns
A `File` object.
-##### Exceptions
+#### Exceptions
This method can raise a [DOMException](/en-US/docs/Web/API/DOMException) with the following codes:
diff --git a/files/en-us/web/api/formdata/set/index.md b/files/en-us/web/api/formdata/set/index.md
index f746fadb75c5ecc..34b5b8de1904d01 100644
--- a/files/en-us/web/api/formdata/set/index.md
+++ b/files/en-us/web/api/formdata/set/index.md
@@ -25,7 +25,7 @@ set(name, value)
set(name, value, filename)
```
-#### Parameters
+### Parameters
- `name`
- : The name of the field whose data is contained in `value`.
diff --git a/files/en-us/web/api/html_dom_api/index.md b/files/en-us/web/api/html_dom_api/index.md
index ffd678266a029b0..b9f59ade4385657 100644
--- a/files/en-us/web/api/html_dom_api/index.md
+++ b/files/en-us/web/api/html_dom_api/index.md
@@ -311,7 +311,7 @@ The {{domxref("EventSource")}} interface represents the source which sent or is
In this example, an {{HTMLElement("input")}} element's {{domxref("HTMLElement/input_event", "input")}} event is monitored in order to update the state of a form's "submit" button based on whether or not a given field currently has a value.
-#### JavaScript
+### JavaScript
```js
const nameField = document.getElementById("userName");
@@ -341,7 +341,7 @@ Then {{domxref("EventTarget.addEventListener", "addEventListener()")}} is called
With this in place, the "Send" button is always enabled whenever the user name input field has a value, and disabled when it's empty.
-#### HTML
+### HTML
The HTML for the form looks like this:
@@ -360,7 +360,7 @@ The HTML for the form looks like this:
```
-#### Result
+### Result
{{EmbedLiveSample("Examples", 640, 300)}}
diff --git a/files/en-us/web/api/htmlimageelement/align/index.md b/files/en-us/web/api/htmlimageelement/align/index.md
index a9f1baeb04fb573..7b9c3816c8e94a1 100644
--- a/files/en-us/web/api/htmlimageelement/align/index.md
+++ b/files/en-us/web/api/htmlimageelement/align/index.md
@@ -36,7 +36,7 @@ content attribute.
A string specifying one of the following strings which set the
alignment mode for the image.
-#### Baseline alignment
+### Baseline alignment
These three values specify the alignment of the element relative to the text baseline.
These should be replaced by using the CSS {{cssxref("vertical-align")}} property.
@@ -52,7 +52,7 @@ These should be replaced by using the CSS {{cssxref("vertical-align")}} property
It may be worth noting that {{cssxref("vertical-align")}} offers several additional
options for its value; you may wish to consider these when changing your code to use it.
-#### Floating images horizontally
+### Floating images horizontally
The `left` and `right` properties don't affect the
baseline-relative alignment. Instead, they cause the image to "float" to the left or
diff --git a/files/en-us/web/api/htmlimageelement/sizes/index.md b/files/en-us/web/api/htmlimageelement/sizes/index.md
index 36b17c429f27705..f606b4ff83bbcd2 100644
--- a/files/en-us/web/api/htmlimageelement/sizes/index.md
+++ b/files/en-us/web/api/htmlimageelement/sizes/index.md
@@ -36,7 +36,7 @@ comprised of a media condition, then at least one whitespace character, then the
**source size value** to use for the image when the media condition
evaluates to `true`.
-#### Media conditions
+### Media conditions
Each source size descriptor consists of a media condition as defined by the media
queries standard. Because a source size descriptor is used to specify the width to use
@@ -45,7 +45,7 @@ necessarily) based entirely on width information. See
{{SectionOnPage("/en-US/docs/Web/CSS/Media_Queries/Using_media_queries", "Syntax")}} for
details on how to construct a media condition.
-#### Source size values
+### Source size values
The source size value is a [CSS length](/en-US/docs/Web/CSS/length). It may
be specified using font-relative units (such as `em` or `ex`),
diff --git a/files/en-us/web/api/keyboardevent/metakey/index.md b/files/en-us/web/api/keyboardevent/metakey/index.md
index 1be8856d3a6ab66..71d07f2a6e2f2fd 100644
--- a/files/en-us/web/api/keyboardevent/metakey/index.md
+++ b/files/en-us/web/api/keyboardevent/metakey/index.md
@@ -42,7 +42,7 @@ function ismetaKey(e) {
}
```
-#### Result
+### Result
{{ EmbedLiveSample('Examples', 400, 90) }}
diff --git a/files/en-us/web/api/media_capture_and_streams_api/constraints/index.md b/files/en-us/web/api/media_capture_and_streams_api/constraints/index.md
index 698b3dd0880ab1f..42b186a8652ee4a 100644
--- a/files/en-us/web/api/media_capture_and_streams_api/constraints/index.md
+++ b/files/en-us/web/api/media_capture_and_streams_api/constraints/index.md
@@ -303,7 +303,7 @@ h3 {
}
```
-#### Defaults and variables
+### Defaults and variables
First we have the default constraint sets, as strings. These strings are presented in editable {{HTMLElement("textarea")}}s, but this is the initial configuration of the stream.
@@ -360,7 +360,7 @@ videoConstraintEditor.value = videoDefaultConstraintString;
audioConstraintEditor.value = audioDefaultConstraintString;
```
-#### Updating the settings display
+### Updating the settings display
To the right of each of the constraint set editors is a second text box which we use to display the current configuration of the track's configurable properties. This display is updated by the function `getCurrentSettings()`, which gets the current settings for the audio and video tracks and inserts the corresponding code into the tracks' settings display boxes by setting their {{htmlattrxref("value", "textarea")}}.
@@ -378,7 +378,7 @@ function getCurrentSettings() {
This gets called after the stream first starts up, as well as any time we've applied updated constraints, as you'll see below.
-#### Building the track constraint set objects
+### Building the track constraint set objects
The `buildConstraints()` function builds the {{domxref("MediaTrackConstraints")}} objects for the audio and video tracks using the code in the two tracks' constraint set edit boxes.
@@ -395,7 +395,7 @@ function buildConstraints() {
This uses {{jsxref("JSON.parse()")}} to parse the code in each editor into an object. If either call to JSON.parse() throws an exception, `handleError()` is called to output the error message to the log.
-#### Configuring and starting the stream
+### Configuring and starting the stream
The `startVideo()` method handles setting up and starting the video stream.
@@ -453,7 +453,7 @@ document.getElementById("startButton").addEventListener(
);
```
-#### Applying constraint set updates
+### Applying constraint set updates
Next, we set up an event listener for the "Apply Constraints" button. If it's clicked and there's not already media in use, we call `startVideo()`, and let that function handle starting the stream with the specified settings in place. Otherwise, we follow these steps to apply the updated constraints to the already-active stream:
@@ -496,7 +496,7 @@ document.getElementById("applyButton").addEventListener(
);
```
-#### Handling the stop button
+### Handling the stop button
Then we set up the handler for the stop button.
@@ -517,7 +517,7 @@ document.getElementById("stopButton").addEventListener("click", () => {
This stops the active tracks, sets the `videoTrack` and `audioTrack` variables to `null` so we know they're gone, and removes the stream from the {{HTMLElement("video")}} element by setting {{domxref("HTMLMediaElement.srcObject")}} to `null`.
-#### Simple tab support in the editor
+### Simple tab support in the editor
This code adds simple support for tabs to the {{HTMLElement("textarea")}} elements by making the tab key insert two space characters when either constraint edit box is focused.
@@ -541,7 +541,7 @@ videoConstraintEditor.addEventListener("keydown", keyDownHandler, false);
audioConstraintEditor.addEventListener("keydown", keyDownHandler, false);
```
-#### Show constrainable properties the browser supports
+### Show constrainable properties the browser supports
The last significant piece of the puzzle: code that displays, for the user's reference, a list of the constrainable properties which their browser supports. Each property is a link to its documentation on MDN for the user's convenience. See the {{SectionOnPage("/en-US/docs/Web/API/MediaDevices/getSupportedConstraints", "Example")}} for details on how this code works.
@@ -559,7 +559,7 @@ for (const constraint in supportedConstraints) {
}
```
-#### Error handling
+### Error handling
We also have some simple error handling code; `handleError()` is called to handle promises which fail, and the `log()` function appends the error message to a special logging {{HTMLElement("div")}} box under the video.
diff --git a/files/en-us/web/api/mediadevices/devicechange_event/index.md b/files/en-us/web/api/mediadevices/devicechange_event/index.md
index fd3b19d44eeb34a..652e87c4db94b0d 100644
--- a/files/en-us/web/api/mediadevices/devicechange_event/index.md
+++ b/files/en-us/web/api/mediadevices/devicechange_event/index.md
@@ -156,7 +156,7 @@ const audioList = document.getElementById("audioList");
const videoList = document.getElementById("videoList");
```
-#### Getting and drawing the device list
+### Getting and drawing the device list
Now let's take a look at `updateDeviceList()` itself. This method is called
any time we want to fetch the current list of media devices and then update the
@@ -212,7 +212,7 @@ parentheses, it's appended to the appropriate list by calling
{{domxref("Node.appendChild", "appendChild()")}} on either `audioList` or
`videoList`, as appropriate based on the device type.
-#### Handling device list changes
+### Handling device list changes
We call `updateDeviceList()` in two places. The first is in the
{{domxref("MediaDevices.getUserMedia", "getUserMedia()")}} promise's fulfillment
diff --git a/files/en-us/web/api/mediaerror/code/index.md b/files/en-us/web/api/mediaerror/code/index.md
index e91ac04aa22e06f..173c0a118e1cf72 100644
--- a/files/en-us/web/api/mediaerror/code/index.md
+++ b/files/en-us/web/api/mediaerror/code/index.md
@@ -27,7 +27,7 @@ string with specific diagnostic information, see {{domxref("MediaError.message")
A numeric value indicating the general type of error which occurred. The possible
values are described below, in [Media error code constants](#media_error_code_constants).
-#### Media error code constants
+### Media error code constants
diff --git a/files/en-us/web/api/request/mode/index.md b/files/en-us/web/api/request/mode/index.md
index bd1c384d7cbde65..f73cd17dbae415e 100644
--- a/files/en-us/web/api/request/mode/index.md
+++ b/files/en-us/web/api/request/mode/index.md
@@ -47,7 +47,7 @@ to determine if cross-origin requests lead to valid responses, and which propert
- `websocket`
- : A special mode used only when establishing a [WebSocket](/en-US/docs/Web/API/WebSockets_API) connection.
-#### Default mode
+### Default mode
Requests can be initiated in a variety of ways, and the mode for a request depends on
the particular means by which it was initiated.
diff --git a/files/en-us/web/api/rtcicecandidate/usernamefragment/index.md b/files/en-us/web/api/rtcicecandidate/usernamefragment/index.md
index bc1e48a4d5ffe92..df233732ee25367 100644
--- a/files/en-us/web/api/rtcicecandidate/usernamefragment/index.md
+++ b/files/en-us/web/api/rtcicecandidate/usernamefragment/index.md
@@ -35,7 +35,7 @@ uniquely identifies a single ongoing ICE interaction, including for any communic
with the {{Glossary("STUN")}} server. The string may be up to 256 characters long, and
has no default value.
-#### Randomization
+### Randomization
At least 24 bits of the text in the `ufrag` are required to be randomly
selected by the ICE layer at the beginning of the ICE session. The specifics for which
diff --git a/files/en-us/web/api/svgstyleelement/index.md b/files/en-us/web/api/svgstyleelement/index.md
index 087c7424f57e4e9..06aeb3ea1c5f263 100644
--- a/files/en-us/web/api/svgstyleelement/index.md
+++ b/files/en-us/web/api/svgstyleelement/index.md
@@ -117,7 +117,7 @@ const style = document.querySelector("#circle_style_id");
This example demonstrates how to get and set the properties of a style element, which in this case was specified in an SVG definition.
-#### HTML
+### HTML
The HTML contains an SVG definition for a [``](/en-US/docs/Web/SVG/Element/circle) with a [`