[Markdown] [Web/HTML] Fix notes in HTML pages that have misplaced colons

files/en-us/web/html/attributes/accept/index.html

@@ -94,7 +94,7 @@ <h3 id="A_basic_example">A basic example</h3>
 <p>{{EmbedLiveSample('A_basic_example', 650, 60)}}</p>
 
 <div class="note">
-<p><strong>Note</strong>: You can find this example on GitHub too — see the <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/simple-file.html">source code</a>, and also <a href="https://mdn.github.io/learning-area/html/forms/file-examples/simple-file.html">see it running live</a>.</p>
+<p><strong>Note:</strong> You can find this example on GitHub too — see the <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/simple-file.html">source code</a>, and also <a href="https://mdn.github.io/learning-area/html/forms/file-examples/simple-file.html">see it running live</a>.</p>
 </div>
 
 <p>Regardless of the user's device or operating system, the file input provides a button that opens up a file picker dialog that allows the user to choose a file.</p>

files/en-us/web/html/element/br/index.html

@@ -18,7 +18,7 @@
 <p>As you can see from the above example, a <code>&lt;br&gt;</code> element is included at each point where we want the text to break. The text after the <code>&lt;br&gt;</code> begins again at the start of the next line of the text block.</p>
 
 <div class="note">
-<p><strong>Note</strong>: Do not use <code>&lt;br&gt;</code> to create margins between paragraphs; wrap them in {{htmlelement("p")}} elements and use the <a href="/en-US/docs/Web/CSS">CSS</a> {{cssxref('margin')}} property to control their size.</p>
+<p><strong>Note:</strong> Do not use <code>&lt;br&gt;</code> to create margins between paragraphs; wrap them in {{htmlelement("p")}} elements and use the <a href="/en-US/docs/Web/CSS">CSS</a> {{cssxref('margin')}} property to control their size.</p>
 </div>
 
 <h2 id="Attributes">Attributes</h2>

files/en-us/web/html/element/canvas/index.html

@@ -119,7 +119,7 @@ <h3 id="Maximum_canvas_size">Maximum canvas size</h3>
 </table>
 
 <div class="notecard note">
-<p><strong>Note</strong>: Exceeding the maximum dimensions or area renders the canvas unusable — drawing commands will not work.</p>
+<p><strong>Note:</strong> Exceeding the maximum dimensions or area renders the canvas unusable — drawing commands will not work.</p>
 </div>
 
 <h2 id="Examples">Examples</h2>

files/en-us/web/html/element/input/color/index.html

@@ -54,7 +54,7 @@ <h2 id="Value">Value</h2>
 <p>The {{htmlattrxref("value", "input")}} of an {{HTMLElement("input")}} element of type <code>color</code> is always a {{domxref("DOMString")}} which contains a 7-character string specifying an RGB color in hexadecimal format. While you can input the color in either upper- or lower-case, it will be stored in lower-case form. The value is never in any other form, and is never empty.</p>
 
 <div class="note">
-<p><strong>Note</strong>: Setting the value to anything that isn't a valid, fully-opaque, RGB color <em>in hexadecimal notation</em> will result in the value being set to <code>#000000</code>. In particular, you can't use CSS's standardized color names, or any CSS function syntax, to set the value. This makes sense when you keep in mind that HTML and CSS are separate languages and specifications. In addition, colors with an alpha channel are not supported; specifying a color in 9-character hexadecimal notation (e.g. <code>#009900aa</code>) will also result in the color being set to <code>#000000</code>.</p>
+<p><strong>Note:</strong> Setting the value to anything that isn't a valid, fully-opaque, RGB color <em>in hexadecimal notation</em> will result in the value being set to <code>#000000</code>. In particular, you can't use CSS's standardized color names, or any CSS function syntax, to set the value. This makes sense when you keep in mind that HTML and CSS are separate languages and specifications. In addition, colors with an alpha channel are not supported; specifying a color in 9-character hexadecimal notation (e.g. <code>#009900aa</code>) will also result in the color being set to <code>#000000</code>.</p>
 </div>
 
 <h2 id="Using_color_inputs">Using color inputs</h2>

files/en-us/web/html/element/input/date/index.html

@@ -169,7 +169,7 @@ <h3 id="Setting_maximum_and_minimum_dates">Setting maximum and minimum dates</h3
 <p>The result is that only days in April 2017 can be selected — the month and year parts of the textbox will be uneditable, and dates outside April 2017 can't be selected in the picker widget.</p>
 
 <div class="note">
-<p><strong>Note</strong>: You <em>should</em> be able to use the {{htmlattrxref("step", "input")}} attribute to vary the number of days jumped each time the date is incremented (e.g. to only make Saturdays selectable). However, this does not seem to be in any implementation at the time of writing.</p>
+<p><strong>Note:</strong> You <em>should</em> be able to use the {{htmlattrxref("step", "input")}} attribute to vary the number of days jumped each time the date is incremented (e.g. to only make Saturdays selectable). However, this does not seem to be in any implementation at the time of writing.</p>
 </div>
 
 <h3 id="Controlling_input_size">Controlling input size</h3>
@@ -470,7 +470,7 @@ <h3 id="JavaScript">JavaScript</h3>
 }</pre>
 
 <div class="note">
-<p><strong>Note</strong>: Remember that some years have 53 weeks in them (see <a href="https://en.wikipedia.org/wiki/ISO_week_date#Weeks_per_year">Weeks per year</a>)! You'll need to take this into consideration when developing production apps.</p>
+<p><strong>Note:</strong> Remember that some years have 53 weeks in them (see <a href="https://en.wikipedia.org/wiki/ISO_week_date#Weeks_per_year">Weeks per year</a>)! You'll need to take this into consideration when developing production apps.</p>
 </div>
 
 <h2 id="Specifications">Specifications</h2>

files/en-us/web/html/element/input/datetime-local/index.html

@@ -168,7 +168,7 @@ <h3 id="Setting_maximum_and_minimum_dates_and_times">Setting maximum and minimum
 </ul>
 
 <div class="note">
-<p><strong>Note</strong>: You should be able to use the {{htmlattrxref("step", "input")}} attribute to vary the number of days jumped each time the date is incremented (e.g. maybe you only want to make Saturdays selectable). However, this does not seem to work effectively in any implementation at the time of writing.</p>
+<p><strong>Note:</strong> You should be able to use the {{htmlattrxref("step", "input")}} attribute to vary the number of days jumped each time the date is incremented (e.g. maybe you only want to make Saturdays selectable). However, this does not seem to work effectively in any implementation at the time of writing.</p>
 </div>
 
 <h3 id="Controlling_input_size">Controlling input size</h3>
@@ -572,7 +572,7 @@ <h2 id="Examples">Examples</h2>
 }</pre>
 
 <div class="note">
-<p><strong>Note</strong>: Remember that some years have 53 weeks in them (see <a href="https://en.wikipedia.org/wiki/ISO_week_date#Weeks_per_year">Weeks per year</a>)! You'll need to take this into consideration when developing production apps.</p>
+<p><strong>Note:</strong> Remember that some years have 53 weeks in them (see <a href="https://en.wikipedia.org/wiki/ISO_week_date#Weeks_per_year">Weeks per year</a>)! You'll need to take this into consideration when developing production apps.</p>
 </div>
 
 <h2 id="Specifications">Specifications</h2>

files/en-us/web/html/element/input/file/index.html

@@ -179,7 +179,7 @@ <h3 id="A_basic_example">A basic example</h3>
 <p>{{EmbedLiveSample('A_basic_example', 650, 90)}}</p>
 
 <div class="note">
-<p><strong>Note</strong>: You can find this example on GitHub too — see the <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/simple-file.html">source code</a>, and also <a href="https://mdn.github.io/learning-area/html/forms/file-examples/simple-file.html">see it running live</a>.</p>
+<p><strong>Note:</strong> You can find this example on GitHub too — see the <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/simple-file.html">source code</a>, and also <a href="https://mdn.github.io/learning-area/html/forms/file-examples/simple-file.html">see it running live</a>.</p>
 </div>
 
 <p>Regardless of the user's device or operating system, the file input provides a button that opens up a file picker dialog that allows the user to choose a file.</p>
@@ -208,7 +208,7 @@ <h3 id="Getting_information_on_selected_files">Getting information on selected f
 </dl>
 
 <div class="note">
-<p><strong>Note</strong>: You can set as well as get the value of <code>HTMLInputElement.files</code> in all modern browsers; this was most recently added to Firefox, in version 57 (see {{bug(1384030)}}).</p>
+<p><strong>Note:</strong> You can set as well as get the value of <code>HTMLInputElement.files</code> in all modern browsers; this was most recently added to Firefox, in version 57 (see {{bug(1384030)}}).</p>
 </div>
 
 <h3 id="Limiting_accepted_file_types">Limiting accepted file types</h3>
@@ -248,7 +248,7 @@ <h3 id="Limiting_accepted_file_types">Limiting accepted file types</h3>
 <p>{{EmbedLiveSample('Limiting_accepted_file_types', 650, 90)}}</p>
 
 <div class="note">
-<p><strong>Note</strong>: You can find this example on GitHub too — see the <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/file-with-accept.html">source code</a>, and also <a href="https://mdn.github.io/learning-area/html/forms/file-examples/file-with-accept.html">see it running live</a>.</p>
+<p><strong>Note:</strong> You can find this example on GitHub too — see the <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/file-with-accept.html">source code</a>, and also <a href="https://mdn.github.io/learning-area/html/forms/file-examples/file-with-accept.html">see it running live</a>.</p>
 </div>
 
 <p>It may look similar, but if you try selecting a file with this input, you'll see that the file picker only lets you select the file types specified in the <code>accept</code> value (the exact interface differs across browsers and operating systems).</p>
@@ -277,7 +277,7 @@ <h2 id="Examples">Examples</h2>
 <p>In this example, we'll present a slightly more advanced file chooser that takes advantage of the file information available in the <code>HTMLInputElement.files</code> property, as well as showing off a few clever tricks.</p>
 
 <div class="note">
-<p><strong>Note</strong>: You can see the complete source code for this example on GitHub — <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/file-example.html">file-example.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/file-examples/file-example.html">see it live also</a>). We won't explain the CSS; the JavaScript is the main focus.</p>
+<p><strong>Note:</strong> You can see the complete source code for this example on GitHub — <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/file-example.html">file-example.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/file-examples/file-example.html">see it live also</a>). We won't explain the CSS; the JavaScript is the main focus.</p>
 </div>
 
 <p>First of all, let's look at the HTML:</p>

files/en-us/web/html/element/input/index.html

@@ -1199,7 +1199,7 @@ <h4 id="custom_validation_error_example">Custom validation error example</h4>
 </div>
 
 <div class="notecard note">
-<p><strong>Note</strong>: Firefox supported a proprietary error attribute — <code>x-moz-errormessage</code> — for many versions, which allowed you set custom error messages in a similar way. This has been removed as of version 66 (see {{bug(1513890)}}).</p>
+<p><strong>Note:</strong> Firefox supported a proprietary error attribute — <code>x-moz-errormessage</code> — for many versions, which allowed you set custom error messages in a similar way. This has been removed as of version 66 (see {{bug(1513890)}}).</p>
 </div>
 
 <h3 id="Localization">Localization</h3>

files/en-us/web/html/element/input/month/index.html

@@ -455,7 +455,7 @@ <h3 id="JavaScript">JavaScript</h3>
 }</pre>
 
 <div class="note">
-<p><strong>Note</strong>: Remember that some years have 53 weeks in them (see <a href="https://en.wikipedia.org/wiki/ISO_week_date#Weeks_per_year">Weeks per year</a>)! You'll need to take this into consideration when developing production apps.</p>
+<p><strong>Note:</strong> Remember that some years have 53 weeks in them (see <a href="https://en.wikipedia.org/wiki/ISO_week_date#Weeks_per_year">Weeks per year</a>)! You'll need to take this into consideration when developing production apps.</p>
 </div>
 
 <h2 id="Specifications">Specifications</h2>

files/en-us/web/html/element/input/number/index.html

@@ -150,7 +150,7 @@ <h2 id="Using_number_inputs">Using number inputs</h2>
 </div>
 
 <div class="note">
-<p><strong>Note</strong>: It's crucial to remember that a user can tinker with your HTML behind the scenes, so your site <em>must not</em> use simple client-side validation for any security purposes. You <em>must</em> verify on the server side any transaction in which the provided value may have security implications of any kind.</p>
+<p><strong>Note:</strong> It's crucial to remember that a user can tinker with your HTML behind the scenes, so your site <em>must not</em> use simple client-side validation for any security purposes. You <em>must</em> verify on the server side any transaction in which the provided value may have security implications of any kind.</p>
 </div>
 
 <p>Mobile browsers further help with the user experience by showing a special keyboard more suited for entering numbers when the user tries to enter a value.</p>
@@ -167,7 +167,7 @@ <h3 id="A_simple_number_input">A simple number input</h3>
 <p>A number input is considered valid when empty and when a single number is entered, but is otherwise invalid. If the {{htmlattrxref("required", "input")}} attribute is used, the input is no longer considered valid when empty.</p>
 
 <div class="note">
-<p><strong>Note</strong>: Any number is an acceptable value, as long as it is a <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#valid-floating-point-number">valid floating point number</a> (that is, not <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN">NaN</a> or <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity">Infinity</a>).</p>
+<p><strong>Note:</strong> Any number is an acceptable value, as long as it is a <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#valid-floating-point-number">valid floating point number</a> (that is, not <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN">NaN</a> or <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity">Infinity</a>).</p>
 </div>
 
 <h3 id="Placeholders">Placeholders</h3>

files/en-us/web/html/element/input/radio/index.html

@@ -108,7 +108,7 @@ <h3 id="Data_representation_of_a_radio_group">Data representation of a radio gro
 <p>If you omit the <code>value</code> attribute in the HTML, the submitted form data assigns the value <code>on</code> to the group. In this scenario, if the user clicked on the "Phone" option and submitted the form, the resulting form data would be <code>contact=on</code>, which isn't helpful. So don't forget to set your <code>value</code> attributes!</p>
 
 <div class="note">
-<p><strong>Note</strong>: If no radio button is selected when the form is submitted, the radio group is not included in the submitted form data at all, since there is no value to report.</p>
+<p><strong>Note:</strong> If no radio button is selected when the form is submitted, the radio group is not included in the submitted form data at all, since there is no value to report.</p>
 </div>
 
 <p>It's fairly uncommon to actually want to allow the form to be submitted without any of the radio buttons in a group selected, so it is usually wise to have one default to the <code>checked</code> state. See {{anch("Selecting a radio button by default")}} below.</p>
@@ -221,7 +221,7 @@ <h3 id="Selecting_a_radio_button_by_default">Selecting a radio button by default
 <p>In this case, the first radio button is now selected by default.</p>
 
 <div class="note">
-<p><strong>Note</strong>: If you put the <code>checked</code> attribute on more than one radio button, later instances will override earlier ones; that is, the last <code>checked</code> radio button will be the one that is selected. This is because only one radio button in a group can ever be selected at once, and the user agent automatically deselects others each time a new one is marked as checked.</p>
+<p><strong>Note:</strong> If you put the <code>checked</code> attribute on more than one radio button, later instances will override earlier ones; that is, the last <code>checked</code> radio button will be the one that is selected. This is because only one radio button in a group can ever be selected at once, and the user agent automatically deselects others each time a new one is marked as checked.</p>
 </div>
 
 <h3 id="Providing_a_bigger_hit_area_for_your_radio_buttons">Providing a bigger hit area for your radio buttons</h3>

files/en-us/web/html/element/input/search/index.html

@@ -311,7 +311,7 @@ <h3 id="Search_form_labels_and_accessibility">Search form labels and accessibili
 <p>There is no visual difference from the previous example, but screenreader users have way more information available to them.</p>
 
 <div class="note">
-<p><strong>Note</strong>: See <a href="/en-US/docs/Learn/Accessibility/WAI-ARIA_basics#signpostslandmarks">Signposts/Landmarks</a> for more information about such accessibility features.</p>
+<p><strong>Note:</strong> See <a href="/en-US/docs/Learn/Accessibility/WAI-ARIA_basics#signpostslandmarks">Signposts/Landmarks</a> for more information about such accessibility features.</p>
 </div>
 
 <h3 id="Physical_input_element_size">Physical input element size</h3>
@@ -335,7 +335,7 @@ <h2 id="Validation">Validation</h2>
 <p><code>&lt;input&gt;</code> elements of type <code>search</code> have the same validation features available to them as regular <code>text</code> inputs. It is less likely that you'd want to use validation features in general for search boxes. In many cases, users should just be allowed to search for anything, but there are a few cases to consider, such as searches against data of a known format.</p>
 
 <div class="note">
-<p><strong>Note</strong>: HTML form validation is <em>not</em> a substitute for scripts that ensure that the entered data is in the proper format. It's far too easy for someone to make adjustments to the HTML that allow them to bypass the validation, or to remove it entirely. It's also possible for someone to bypass your HTML entirely and submit the data directly to your server. If your server-side code fails to validate the data it receives, disaster could strike when improperly-formatted data (or data which is too large, is of the wrong type, and so forth) is entered into your database.</p>
+<p><strong>Note:</strong> HTML form validation is <em>not</em> a substitute for scripts that ensure that the entered data is in the proper format. It's far too easy for someone to make adjustments to the HTML that allow them to bypass the validation, or to remove it entirely. It's also possible for someone to bypass your HTML entirely and submit the data directly to your server. If your server-side code fails to validate the data it receives, disaster could strike when improperly-formatted data (or data which is too large, is of the wrong type, and so forth) is entered into your database.</p>
 </div>
 
 <h3 id="A_note_on_styling">A note on styling</h3>