diff --git a/files/en-us/glossary/cacheable/index.html b/files/en-us/glossary/cacheable/index.html index 66f04d5da5bc037..2d80599610b3678 100644 --- a/files/en-us/glossary/cacheable/index.html +++ b/files/en-us/glossary/cacheable/index.html @@ -17,7 +17,7 @@
When both, the method of the request and the status of the response, are cacheable, the response to the request can be cached:
-GET /pageX.html HTTP/1.1 +GET /pageX.html HTTP/1.1 (…) 200 OK @@ -26,7 +26,7 @@A {{HTTPMethod("PUT")}} request cannot be cached. Moreover, it invalidates cached data for request to the same URI done via {{HTTPMethod("HEAD")}} or {{HTTPMethod("GET")}}:
-PUT /pageX.html HTTP/1.1 +PUT /pageX.html HTTP/1.1 (…) 200 OK @@ -35,7 +35,7 @@A specific {{HTTPHeader("Cache-Control")}} header in the response can prevent caching:
-GET /pageX.html HTTP/1.1 +GET /pageX.html HTTP/1.1 (…) 200 OK diff --git a/files/en-us/glossary/cipher/index.html b/files/en-us/glossary/cipher/index.html index fd6732b6c62d61e..35e73844f3896fa 100644 --- a/files/en-us/glossary/cipher/index.html +++ b/files/en-us/glossary/cipher/index.html @@ -9,7 +9,7 @@ ---In {{glossary("cryptography")}}, a cipher is an algorithm that can {{glossary("encryption", "encode")}} {{glossary("Plaintext")}} to make it unreadable, and to {{glossary("decryption", "decode")}} it back.
-Ciphers were common long before the information age (e.g., substitution ciphers, transposition ciphers, and permutation ciphers), but none of them were cryptographically secure except for the one-time pad.
+Ciphers were common long before the information age (e.g., substitution ciphers, transposition ciphers, and permutation ciphers), but none of them were cryptographically secure except for the one-time pad.
Modern ciphers are designed to withstand {{glossary("attack", "attacks")}} discovered by a {{glossary("cryptanalysis", "cryptanalyst")}}. There is no guarantee that all attack methods have been discovered, but each algorithm is judged against known classes of attacks.
diff --git a/files/en-us/glossary/client_hints/index.html b/files/en-us/glossary/client_hints/index.html index b84ec0f0db1cb64..3cbc5b14d434cf4 100644 --- a/files/en-us/glossary/client_hints/index.html +++ b/files/en-us/glossary/client_hints/index.html @@ -19,7 +19,7 @@Overview
For example, following
-Accept-CH
in a response below, the client could append {{HTTPHeader("Width")}} and {{HTTPHeader("Downlink")}} headers to all subsequent requests.Accept-CH: Width, Downlink+Accept-CH: Width, DownlinkNote: Client hints can also be specified in HTML using the {{HTMLElement("meta")}} element with the
@@ -31,7 +31,7 @@http-equiv
attribute.Caching and Client Hints
Client hints that determine which resources are sent in responses should "generally" also be included in the affected response's {{HTTPHeader("Vary")}} header. This ensures that a different resource is cached for every different value of the hint header.
-Vary: Accept, Width, ECT+Vary: Accept, Width, ECTYou may prefer to omit specifying {{HTTPHeader("Vary")}} or use some other strategy for client hint headers where the value changes a lot, as this effectively makes the resource uncachable (a new cache entry is created for every different value). This applies in particular to network client hints like {{HTTPHeader("Downlink")}} and {{HTTPHeader("RTT")}}. For more information see HTTP Caching > Varying responses.
@@ -53,5 +53,5 @@See also
Client Hints headers Vary
HTTP HeaderClient Hints Infrastructure - + diff --git a/files/en-us/glossary/cors-safelisted_response_header/index.html b/files/en-us/glossary/cors-safelisted_response_header/index.html index a51d1190044bf33..d912ec8ee886f32 100644 --- a/files/en-us/glossary/cors-safelisted_response_header/index.html +++ b/files/en-us/glossary/cors-safelisted_response_header/index.html @@ -23,8 +23,7 @@Additional headers can be added to the safelist using {{HTTPHeader("Access-Control-Expose-Headers")}}.
-diff --git a/files/en-us/glossary/css_selector/index.html b/files/en-us/glossary/css_selector/index.html index 9ecdaee991795c4..2cafdbef4dc3dbe 100644 --- a/files/en-us/glossary/css_selector/index.html +++ b/files/en-us/glossary/css_selector/index.html @@ -11,7 +11,8 @@ ---Note
-{{HTTPHeader("Content-Length")}} was not part of the original set of safelisted response headers [ref]
+Note: {{HTTPHeader("Content-Length")}} was not part of the original set of safelisted response headers [ref]
A CSS selector is the part of a CSS rule that describes what elements in a document the rule will match. The matching elements will have the rule's specified style applied to them.
-+Example
+Consider this CSS:
p { @@ -48,11 +49,10 @@ Be careful! There are wizards present, and they are quick to anger! </div> </div>-The resulting page content is styled like this:
-{{EmbedLiveSample("glossary-selector-details", 640, 210)}}
+{{EmbedLiveSample("Example", 640, 240)}}
See also
@@ -88,4 +88,3 @@See also
- diff --git a/files/en-us/glossary/dos_attack/index.html b/files/en-us/glossary/dos_attack/index.html index bcb80e5d55cb629..f5ea5f37f39e289 100644 --- a/files/en-us/glossary/dos_attack/index.html +++ b/files/en-us/glossary/dos_attack/index.html @@ -7,7 +7,7 @@ ---DoS (Denial of Service) is a network attack that prevents legitimate use of {{glossary("server")}} resources by flooding the server with requests.
-Computers have limited resources, for example computation power or memory. When these are exhausted, the program can freeze or crash, making it unavailable. A DoS attack consists of various techniques to exhaust these resources and make a server or a network unavailable to legitimate users, or at least make the server perform sluggishly.
+Computers have limited resources, for example computation power or memory. When these are exhausted, the program can freeze or crash, making it unavailable. A DoS attack consists of various techniques to exhaust these resources and make a server or a network unavailable to legitimate users, or at least make the server perform sluggishly.
There are also Distributed Denial of Service (DDoS) Attacks in which a multitude of servers are used to exhaust the computing capacity of an attacked computer.
diff --git a/files/en-us/glossary/falsy/index.html b/files/en-us/glossary/falsy/index.html index 35633ec247e79cf..43089eceb2fb021 100644 --- a/files/en-us/glossary/falsy/index.html +++ b/files/en-us/glossary/falsy/index.html @@ -10,8 +10,13 @@{{Glossary("JavaScript")}} uses {{Glossary("Type_Conversion", "type conversion")}} to coerce any value to a Boolean in contexts that require it, such as {{Glossary("Conditional", "conditionals")}} and {{Glossary("Loop", "loops")}}.
+The following table provides a complete list of JavaScript falsy values:
+-
+ + Complete list of JavaScript falsy values
Value +Description +@@ -83,4 +88,3 @@ false
See also
{{Glossary("Truthy")}} {{Glossary("Boolean")}} - diff --git a/files/en-us/glossary/grid/index.html b/files/en-us/glossary/grid/index.html index 0a0e2bcba52d80b..6535c186761770d 100644 --- a/files/en-us/glossary/grid/index.html +++ b/files/en-us/glossary/grid/index.html @@ -14,9 +14,9 @@In the example below I have created an explicit grid of three columns and two rows. The third row on the grid is an implicit grid row track, formed due to their being more than the six items which fill the explicit tracks.
----* {box-sizing: border-box;} +Example
+ + -.wrapper { display: grid; @@ -52,11 +51,10 @@ <div>Eight</div> </div>-{{ EmbedLiveSample('example', '500', '330') }}
+{{ EmbedLiveSample('Example', '500', '330') }}
-See also
+See also
- Basic concepts of grid layout
diff --git a/files/en-us/glossary/grid_areas/index.html b/files/en-us/glossary/grid_areas/index.html index ec17590e64c22ae..b3ecee568ba1adf 100644 --- a/files/en-us/glossary/grid_areas/index.html +++ b/files/en-us/glossary/grid_areas/index.html @@ -12,11 +12,11 @@Grid areas must be rectangular in nature; it is not possible to create, for example, a T- or L-shaped grid area.
+Example
+In the example below I have a grid container with two grid items. I have named these with the {{cssxref("grid-area")}} property and then laid them out on the grid using {{cssxref("grid-template-areas")}}. This creates two grid areas, one covering four grid cells, the other two.
--+-* {box-sizing: border-box;} +-.wrapper { display: grid; @@ -56,8 +55,7 @@ </div>-{{ EmbedLiveSample('example_1', '300', '280') }}
-{{ EmbedLiveSample('Example', '300', '280') }}
See also
diff --git a/files/en-us/glossary/grid_cell/index.html b/files/en-us/glossary/grid_cell/index.html index 4406886061be4e9..3ee71e280348e6a 100644 --- a/files/en-us/glossary/grid_cell/index.html +++ b/files/en-us/glossary/grid_cell/index.html @@ -10,11 +10,11 @@If you do not place items using one of the grid placement methods, direct children of the grid container will be placed one into each individual grid cell by the auto-placement algorithm. Additional row or column {{glossary("grid tracks", "tracks")}} will be created to create enough cells to hold all items.
+Example
+In the example we have created a three column track grid. The five items are placed into grid cells working along an initial row of three grid cells, then creating a new row for the remaining two.
--+-* {box-sizing: border-box;} +-.wrapper { display: grid; @@ -48,10 +47,9 @@ </div>-{{ EmbedLiveSample('example_1', '300', '280') }}
-{{ EmbedLiveSample('Example', '300', '280') }}
-See also
+See also
Property reference
diff --git a/files/en-us/glossary/grid_lines/index.html b/files/en-us/glossary/grid_lines/index.html index ae83a362246174e..d43e9e6b9731c25 100644 --- a/files/en-us/glossary/grid_lines/index.html +++ b/files/en-us/glossary/grid_lines/index.html @@ -4,11 +4,13 @@ tags: - CSS Grids --- -Grid lines are created when you define {{glossary("Grid tracks", "tracks")}} in the explicit grid using CSS Grid Layout. In the following example there is a grid with three column tracks and two row tracks. This gives us 4 column lines and 3 row lines.
+Grid lines are created when you define {{glossary("Grid tracks", "tracks")}} in the explicit grid using CSS Grid Layout.
---* {box-sizing: border-box;} +Example
+ +In the following example there is a grid with three column tracks and two row tracks. This gives us 4 column lines and 3 row lines.
+ + -<div class="wrapper"> <div>One</div> @@ -45,12 +46,11 @@ }-{{ EmbedLiveSample('example_1', '500', '250') }}
+{{ EmbedLiveSample('Example', '500', '250') }}
Lines can be addressed using their line number. In a left-to-right language such as English, column line 1 will be on the left of the grid, row line 1 on the top. Lines numbers respect the writing mode of the document and so in a right-to-left language for example, column line 1 will be on the right of the grid. The image below shows the line numbers of the grid, assuming the language is left-to-right.
-Lines are also created in the implicit grid when implicit tracks are created to hold content positioned outside of the explicit grid, however these lines cannot be addressed by a number.
@@ -58,9 +58,7 @@Placing items onto the grid
Having created a grid, you can place items onto the grid by line number. In the following example the item is positioned from column line 1 to column line 3, and from row line 1 to row line 3.
--+-* {box-sizing: border-box;} +-<div class="wrapper"> <div class="item">Item</div> @@ -99,16 +96,13 @@-Placing items onto the grid }
{{ EmbedLiveSample('example_2', '500', '250') }}
-{{ EmbedLiveSample('Placing_items_onto_the_grid_by_line_number', '500', '250') }}
Naming lines
The lines created in the explicit grid can be named, by adding the name in square brackets before or after the track sizing information. When placing an item, you can then use these names instead of the line number, as demonstrated below.
--+-* {box-sizing: border-box;} +-<div class="wrapper"> <div class="item">Item</div> @@ -147,10 +140,9 @@-Naming lines
}{{ EmbedLiveSample('example_3', '500', '250') }}
-{{ EmbedLiveSample('Naming_lines', '500', '250') }}
-See also
+See also
Property reference
diff --git a/files/en-us/glossary/grid_tracks/index.html b/files/en-us/glossary/grid_tracks/index.html index c0d854a98213310..6fb54da21ef6310 100644 --- a/files/en-us/glossary/grid_tracks/index.html +++ b/files/en-us/glossary/grid_tracks/index.html @@ -12,11 +12,13 @@Track sizing in the explicit grid
-When defining grid tracks using {{cssxref("grid-template-columns")}} and {{cssxref("grid-template-rows")}} you may use any length unit, and also the flex unit,
+fr
which indicates a portion of the available space in the grid container. The example below demonstrates a grid with three column tracks, one of 200 pixels, the second of 1fr, the third of 3fr. Once the 200 pixels has been subtracted from the space available in the grid container, the remaining space is divided by 4. One part is given to column 2, 3 parts to column 3.When defining grid tracks using {{cssxref("grid-template-columns")}} and {{cssxref("grid-template-rows")}} you may use any length unit, and also the flex unit,
-fr
which indicates a portion of the available space in the grid container.-+-* {box-sizing: border-box;} +Example
+ +The example below demonstrates a grid with three column tracks, one of 200 pixels, the second of 1fr, the third of 3fr. Once the 200 pixels has been subtracted from the space available in the grid container, the remaining space is divided by 4. One part is given to column 2, 3 parts to column 3.
+ +.wrapper { display: grid; @@ -49,8 +50,7 @@Track sizing in the explicit grid
-{{ EmbedLiveSample('example_1', '500', '230') }}
-{{ EmbedLiveSample('Example', '500', '230') }}
Track sizing in the implicit grid
diff --git a/files/en-us/glossary/gutters/index.html b/files/en-us/glossary/gutters/index.html index 191ea162cc04668..dc9153184ddd1af 100644 --- a/files/en-us/glossary/gutters/index.html +++ b/files/en-us/glossary/gutters/index.html @@ -6,11 +6,11 @@ ---Gutters or alleys are spacing between content tracks. These can be created in CSS Grid Layout using the {{cssxref("column-gap")}}, {{cssxref("row-gap")}}, or {{cssxref("gap")}} properties.
+Example
+In the example below we have a three-column and two-row track grid, with 20-pixel gaps between column tracks and
-20px
-gaps between row tracks.-+-* {box-sizing: border-box;} +-.wrapper { display: grid; @@ -46,8 +45,7 @@ </div>-{{ EmbedLiveSample('example_1', '300', '280') }}
-{{ EmbedLiveSample('Example', '300', '280') }}
In terms of grid sizing, gaps act as if they were a regular grid track however nothing can be placed into the gap. The gap acts as if the grid line at that location has gained extra size, so any grid item placed after that line begins at the end of the gap.
diff --git a/files/en-us/glossary/idl/index.html b/files/en-us/glossary/idl/index.html index 415d3570942ab88..b2dcfd32f22d8dd 100644 --- a/files/en-us/glossary/idl/index.html +++ b/files/en-us/glossary/idl/index.html @@ -15,7 +15,7 @@Content versus IDL attributes
The content attribute is the attribute as you set it from the content (the HTML code) and you can set it or get it via {{domxref("element.setAttribute()")}} or {{domxref("element.getAttribute()")}}. The content attribute is always a string even when the expected value should be an integer. For example, to set an {{HTMLElement("input")}} element's
-maxlength
to 42 using the content attribute, you have to callsetAttribute("maxlength", "42")
on that element.The IDL attribute is also known as a JavaScript property. These are the attributes you can read or set using JavaScript properties like
+element.foo
. The IDL attribute is always going to use (but might transform) the underlying content attribute to return a value when you get it and is going to save something in the content attribute when you set it. In other words, the IDL attributes, in essence, reflect the content attributes.The IDL attribute is also known as a JavaScript property. These are the attributes you can read or set using JavaScript properties like
element.foo
. The IDL attribute is always going to use (but might transform) the underlying content attribute to return a value when you get it and is going to save something in the content attribute when you set it. In other words, the IDL attributes, in essence, reflect the content attributes.Most of the time, IDL attributes will return their values as they are really used. For example, the default
diff --git a/files/en-us/glossary/opengl/index.html b/files/en-us/glossary/opengl/index.html index 5b4ed8b9571238e..597cf0ef1341c37 100644 --- a/files/en-us/glossary/opengl/index.html +++ b/files/en-us/glossary/opengl/index.html @@ -6,7 +6,7 @@ - Glossary - OpenGL --- -type
for {{HTMLElement("input")}} elements is "text", so if you setinput.type="foobar"
, the<input>
element will be of type text (in the appearance and the behavior) but the "type" content attribute's value will be "foobar". However, thetype
IDL attribute will return the string "text".OpenGL (Open Graphics Library) is a cross-language, multi-platform application programming interface (API) for rendering 2D and 3D vector graphics. The API is typically used to interact with a graphics processing unit (GPU), to achieve hardware-accelerated rendering.
+OpenGL (Open Graphics Library) is a cross-language, multi-platform application programming interface (API) for rendering 2D and 3D vector graphics. The API is typically used to interact with a graphics processing unit (GPU), to achieve hardware-accelerated rendering.
See also
diff --git a/files/en-us/glossary/percent-encoding/index.html b/files/en-us/glossary/percent-encoding/index.html index 09e1888f90c466a..cc6be4780660d07 100644 --- a/files/en-us/glossary/percent-encoding/index.html +++ b/files/en-us/glossary/percent-encoding/index.html @@ -9,50 +9,90 @@Special characters needing encoding are:
-':'
,'/'
,'?'
,'#'
,'['
,']'
,'@'
,'!'
,'$'
,'&'
,"'"
,'('
,')'
,'*'
,'+'
,','
,';'
,'='
, as well as'%'
itself. Other characters don't need to be encoded, though they could.+
+ +
Character +Encoding +- ':'
- '/'
- '?'
- '#'
- '['
- ']'
- '@'
- '!'
- '$'
- '&'
- "'"
- '('
- ')'
- '*'
- '+'
- ','
- ';'
- '='
- '%'
+ ' '
%3A
- ++ %3A
'/'
+ %2F
+ +'?'
+ %3F
+ +'#'
+ %23
+ +'['
+ %5B
+ +']'
+ %5D
+ +'@'
+ %40
+ +'!'
+ %21
+ +'$'
+ %24
+ +'&'
+ %26
+ +"'"
+ %27
+ +'('
+ %28
+ +')'
+ %29
+ +'*'
+ %2A
+ +'+'
+ %2B
+ +','
+ %2C
+ +';'
+ %3B
+ +'='
+ %3D
+ +'%'
+ %25
+ diff --git a/files/en-us/glossary/response_header/index.html b/files/en-us/glossary/response_header/index.html index 3471db489135a92..ab24343be3037c4 100644 --- a/files/en-us/glossary/response_header/index.html +++ b/files/en-us/glossary/response_header/index.html @@ -11,7 +11,7 @@' '
%20
or+
The following shows a few response and representation headers after a {{HTTPMethod("GET")}} request.
-200 OK +200 OK Access-Control-Allow-Origin: * Connection: Keep-Alive Content-Encoding: gzip @@ -43,4 +43,3 @@See also
- diff --git a/files/en-us/glossary/round_trip_time_(rtt)/index.html b/files/en-us/glossary/round_trip_time_(rtt)/index.html index 2869c5209e0bc32..c32107945255654 100644 --- a/files/en-us/glossary/round_trip_time_(rtt)/index.html +++ b/files/en-us/glossary/round_trip_time_(rtt)/index.html @@ -11,7 +11,7 @@ ---Round Trip Time (RTT) is the length time it takes for a data packet to be sent to a destination plus the time it takes for an acknowledgment of that packet to be received back at the origin. The RTT between a network and server can be determined by using the
-ping
command.$ ping example.com +$ ping example.com PING example.com (216.58.194.174): 56 data bytes 64 bytes from 216.58.194.174: icmp_seq=0 ttl=55 time=25.050 ms 64 bytes from 216.58.194.174: icmp_seq=1 ttl=55 time=23.781 ms