How to call JavaScript function on link click instead of href in HTML?

To call JavaScript function on link click instead of href in HTML, we set the onclick attribute to call a JavaScript function.

For instance, we write

<a href="javascript:void(0);" onclick="showOld(2367, 146986,2);"> </a>

to set the href attribute to javascript:void(0); to stop navigation.

And we set the onclick attribute to call the showOld function.

How to remove the “No file chosen” tooltip from a file input in Chrome with HTML?

To remove the "No file chosen" tooltip from a file input in Chrome with HTML, we set thr title attribute to a string with a space.

For instance, we write

<input type="file" title=" " />

to add a file input with the title attribute set to a space to make the tooltip empty to remove the message.

How to prevent users from typing in a text field without disabling the field with HTML?

To prevent users from typing in a text field without disabling the field with HTML, we add the readonly attribute.

For instance, we write

<input readonly type="text" />

to add the readonly attribute to the input to stop users from enter input values but not make it grayed out.

How to add a drop-down menu and text field in one with HTML?

To add a drop-down menu and text field in one with HTML, we use the datalist element.

For instance, we write

<label
  >Choose a browser from this list: <input list="browsers" name="myBrowser"
/></label>
<datalist id="browsers">
  <option value="Chrome"></option>
  <option value="Firefox"></option>
  <option value="Internet Explorer"></option>
  <option value="Opera"></option>
  <option value="Safari"></option>
  <option value="Microsoft Edge"></option>
</datalist>

to add a datalist element with an id attribute that matches the list attribute value of the input to use the datalist element’s option eleemnts as the choices for the input.

How to create a responsive image that also scales up in Bootstrap 3 and HTML?

To create a responsive image that also scales up in Bootstrap 3 and HTML, we add the img-responsive class.

For instance, we write

<img src="..." class="img-responsive" alt="Responsive image" />

to add the img-responsive class to the img element to make the image responsive.

How to add text-align: right on select and options elements with HTML?

To add text-align: right on select and options elements with HTML, we set the direction and text-align-last properties.

For instance, we write

<select>
  <option>The first option</option>
  <option>A second, fairly long option</option>
  <option>Last</option>
</select>

to add the select drop down.

Then we write

select {
  text-align-last: right;
}
option {
  direction: rtl;
}

to align the text to the right with text-align-last: right;.

And we set the text direction to right to left with direction: rtl;.