How to prevent a browser from storing passwords with HTML and JavaScript?

To prevent a browser from storing passwords with HTML and JavaScript, we set the autocomplete attribute to off and change the readonly attribute dynamically.

For instance, we write

<input
  type="text"
  name="username"
  autocomplete="off"
  readonly
  onfocus="this.removeAttribute('readonly');"
/>

to set the autocomplete attribute to off.

And we set the onfocus attribute to JavaScript code that calls removeAttribute on the element to remove the readonly attribute when we focus on it.

How to add a form tag in each table row in HTML?

To add a form tag in each table row in HTML, we add a form element and reference the form with the form attribute in the inputs.

For instance, we write

<table>
  <tr>
    <td>Id</td>
    <td>Name</td>
    <td>Description</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>
      <form id="form1"><input type="hidden" name="id" value="1" /></form>
    </td>
    <td><input form="form1" type="text" name="name" value="Name" /></td>
    <td>
      <input form="form1" type="text" name="description" value="Description" />
    </td>
    <td><input form="form1" type="submit" value="Save" /></td>
  </tr>
  <tr>
    <td>
      <form id="form2"><input type="hidden" name="id" value="1" /></form>
    </td>
    <td><input form="form2" type="text" name="name" value="Name" /></td>
    <td>
      <input form="form2" type="text" name="description" value="Description" />
    </td>
    <td><input form="form2" type="submit" value="Save" /></td>
  </tr>
</table>

to add a table with the form element in the first td element of each row.

Then we add inputs to the other td elements and reference the form by its ID with the form attribute.

How to make an HTML button perform a POST request?

To make an HTML button perform a POST request, we add a name and value attribute to the button in the form.

For instance, we write

<form action="" method="post">
  <button name="foo" value="upvote">Upvote</button>
</form>

to add a button with the name and value attributes to make it submit the form.

The form’s method attribute is set to post so a post request is made.

How to add a Font Awesome icon to input field with HTML and CSS?

To add a Font Awesome icon to input field with HTML and CSS, we can set the value attribute.

For instance, we write

<input type="submit" class="search" value="&#xf002;" />

to add a submit button input with the value set to the icon.

Then we write

input[type="submit"] {
  font-family: "Font Awesome 5 Free";
  font-size: 1.3333333333333333em;
  font-weight: 900;
}

to set the font of submit inputs to the Font Awesome font with font-family: "Font Awesome 5 Free";.

How to fix the Youtube iframe loop not working with HTML?

To fix the Youtube iframe loop not working with HTML, we add the playlist query parameter.

For instance, we write

<iframe
  class="embed-responsive-item"
  id="ytplayer"
  type="text/html"
  width="640"
  height="360"
  src="https://www.youtube.com/embed/M7lc1UVf-VE?&autoplay=1&loop=1&rel=0&showinfo=0&color=white&iv_load_policy=3&playlist=M7lc1UVf-VE"
  frameborder="0"
  allowfullscreen
></iframe>

to add the playlist parameter to the embed video URL to autoplay the playlist loop.

How to present a YouTube embed video with sound muted with HTML?

To present a YouTube embed video with sound muted with HTML, we set the mute query parameter to 1.

For instance, we write

<iframe
  src="https://www.youtube.com/embed/uNRGWVJ10gQ?rel=0&amp;autoplay=1&mute=1"
  width="560"
  height="315"
  frameborder="0"
  allowfullscreen
></iframe>

to set the mute query parameter to 1 in the video URL to mute the video embedded with the iframe.