QUIZZ ABOUT THIS BLOG

https://docs.google.com/forms/d/1XDVhFoSHMcx6_jLSbOOPpRNdKOANUxC5oWO2YtufxF4/prefill

color picker

Color Picker

With HTML5, there are some really interactive customizations that visitors to your website will like. The color picker will need a little JavaScript coding and CSS to let you choose what color you want from a palette rather than having to enter an abstract color code. This feature will be particularly user-friendly for those new to coding or without a lot of coding knowledge.

The code can be something like this:

<!--HTML--> Choose a color to color the below text <input 

id="color_picker" type="color" 

nchange="showHex();"> <span id="color_hex_value"></span> 

<h1>COLOR ME !</h1> <!--CSS--> body {
    font-family: "bookman old style";
}
<!--JS--> function showHex() {
    var hex document.querySelector("#color_hex_value"),

 h1 document.querySelector("h1");
    h1.style.color document.querySelector("#color_picker").value;
}

voice recognition

Add voice recognition

In HTML5 and later, you can add speech recognition to a text input, and it's as simple as:

<input type="text" x-webkit-speech />

replacing hightlight

Add background image to text

You can add a background image instead of a highlight to your text if the font is large enough. We recommend not using this tip for fonts smaller than 20 pts, or there won't be much of a difference between the image and a background color. The code is:

<SPAN STYLE=”background-image: url(//www.myimage.png );

 font-size: 20pt”>NoBoringHighlight…</SPAN>

highlight

Highlight text

The <span> tag will let you add highlights to text on both Firefox and IE. You can choose the color of the highlight, of course. The code is simple:

<span style=“ background-color: #FFFF00”>Your text here.</span>

horizontal line

Add a horizontal line

A horizontal line to break up long sections of your website will make the page easier on the eye. To add the line, use the <hr/> tag, as in:

<h1>HTML</h1>

<p>HTML is a language for describing web pages.....</p>

<hr>

<h1>CSS</h1>

<p>CSS defines how to display HTML elements.....</p>

metadata

 Add MetaData

Be seen on Google's searches and other search engine searches by making sure that you have provided meta data about your website. In fact, it is no longer an option, but essential if you want to stay neck on neck with your competition.

Don’t forget to optimize the rest of your website content for users on search engines to find you easily. SEO pros at Freelancer can help you with your back-end SEO and search engine marketing (SEM) needs.

Meanwhile, the code for adding meta is simple:

<meta name=”description” content=”Used auto parts for sale”>

<meta name=”keywords” content=”fuel filters, brake discs, belts” />

INTERESTING TO KNOW

Tableizer

This one is not really an HTML trick since Tableizer is an external app. But it's great for building HTML tables out of data, using existing Calc or Excel spreadsheet templates. You only have to paste your cells into the Tableizer, and it will generate an HTML code snippet to paste into your website code. The result is a neat table where you can edit details like background colors to customize.

R5

I will display €

I will display €

I will display €

This text is bold This text is strong This text is italic This text is emphasized

R4

MAIN 1

MAIN 2

MAIN 3

MAIN 4

MAIN 5

MAIN 6

r3

This is a
paragraph with a line break.

r2

Html first post

Welcome people.