The ::selection CSS pseudo-element


The ::selection selector coordinates the part of a component that is chosen by a client.

There are just three properties that ::selection will work with :

  • color
  • background (background-color, background-image)
  • text-shadow
Example: Default 



Output:


Example: Make the selected text Blue



Output:

Example: Make the selected background-color Blue


Output:

Example: Make the selected background Hibiscus


Output:

Example: Make the selected text blue on a Hibiscus background


Output:

Example: Make the selected text text-shadow 


Output:



Browser Support

The ::selection pseudo-element is supported in Safari, Chrome, Opera, and Internet Explorer 9+.

Firefox supports it prefixed with the -moz- prefix, in the form :

::-moz-selection.

Using text-shadow in ::selection is only supported in Chrome, Safari, Opera, and Firefox.




HTML5 DOWNLOAD ATTRIBUTE


Introduction

HTML5 accompanied new APIs, new input type, and in addition new attributes for Forms. One of the upgrades that accompanied HTML5 is the Download attributes.

How about we Start

As we probably am aware, there are numerous documents that are not downloaded specifically. For instance: pictures, web pages, PDF records,  music documents, and so on. We need to right tap on pictures and after that tap on Save Image to save a image file. In any case, in the event that I need to download a picture record straightforwardly, then I need to utilize the download property.

Utilizing the Download Attribute


Basically sort download in the anchor tag. By utilizing this, when we tap on download image, the image begins  downloading. The same strategy is utilized for downloading PDF, web page records (HTML), and so forth. (I am appending a document in which I have demonstrated a correlation between utilizing the download attributeand not utilizing it.)
In the event that we need to give another name to the download file, then we need to write.


Here, we compose download="myImage". When we tap on Download picture, then a picture record is downloaded with  name  myImage with a .png extension. The browser automatically identifies the correct file extension and adds it to the downloaded file. So there is no need to add the file extension in the download attribute.

HTML List


In HTML, we are having 3 types of list.
  1. Ordered List
  2. Unordered List
  3. Definition List
1) Ordered List :-

It is also called as "Number list", it is used into provide number into the list item .An Ordered list begins with the <ol> tag.
Every list item begins with the <li> tag.
ol
Example:
<ol>
<li>HTML</li>
<li>CSS</li>
<li>JAVASCRIPT</li>
<li>PHP</li>
</ol>
ol

2) Unordered List :-

It is also called as "bulleted list", It is used to give bullets to the list item .An unordered list begins with the <ul> tag.
Every list item begins with the <li> tag.
Example:
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JAVASCRIPT</li>
<li>PHP</li>
</ul>


3) Definition List : -

It is also called as "description list" It is used to give Definitions to Definition terms. Definition List begins with the <dl> tag.
<dt> tag defines a definition term.
<dd> tag defines a definiton data.

Example:
<dl>
  <dt>HTML</dt>
  <dd>It is Hypertext Resources, It is from w3c Organization. Latest version is HTML5.</dd>
  <dt>CSS</dt>
  <dd>Css stands for cascadin style sheet, used to describe the way how to provide Style to the html element. It is client-side language.</dd>
<dt>PHP</dt>
<dd>PHP is a server side scripting language implemented by Rasmus Lerdorp in 1995 Using 'c' and 'Perl' Technologies. By using PHP we can develop Dynamic web Application.</dd>
</dl>



CSS3 Introduction

What is it?

  • CSS3 is the most recent standard for CSS. 
  • CSS3 is totally in reverse good with prior variants of CSS.

CSS3 Modules

The advancement of CSS3 will be part up into 'modules'. The old determination was just too huge and complex to be overhauled as one, so it has been separated into littler pieces – with new ones additionally include.
  • Animations
  • Selectors
  • Box Model
  • Backgrounds and Borders
  • Image Values and Replaced Content
  • Text Effects
  • Multiple Column Layout
  • User Interface

HTML5 Introduction


What is New in HTML5?

The <!DOCTYPE> declaration for HTML5 is very simple.
  • <!DOCTYPE html>
The character encoding (charset)is also very simple.
  • <meta charset="UTF-8">


New HTML5 Elements

  • New semantic elements like <header> <footer> <nav> <section> <article>.
  • New HTML5 Input Types like color, date, datetime, email, search tel, url.
  • New graphic elements like<svg> and <canvas>.
  • New multimedia elements like <audio> and <video>.

New HTML5 API's (Application Programming Interfaces)

The most fascinating new API's are:
  • HTML Drag and Drop
  • HTML Local Storage
  • HTML Geolocation
  • HTML Application Cache
  • HTML Web Workers
  • HTML server-sent events(SSE)

CSS Introduction

What is CSS?

  • CSS stands for Cascading Style Sheets.
  • CSS defines how HTML elements are to be displayed.
  • We can inherit multiple styles from one location to other.
  • It contains use collection of different style, these styles we can applying for html elements.
  • In CSS style are saved with the extention of ".css", these files we can able to link with html files.


CSS Advantages

  • Flexibility  
  • Codes rendering
  • Accessibility
  • Easy manage
  • Global change
  • Save a lot of time
  • Easy maintenance
  • Inline/Internal/External style sheet
  • Page load faster
  • Superior style
  • Multiple device compatibility
  • Global web standard


CSS Syntax

In CSS the syntax is divided into the following three parts.

      1          2         3
" selector { property : value } "
  • selector in normally the HTML tag you wish to define
  • Property is the attributes you wish to change
  • Every property has the value.

Example

Example

HTML Introduction


What is HTML?

  • HTML stands for Hypertext Markup Language.
  • HTML is a language for describing web pages.
  • HTML is a markup language.
  • A markup language is a set of markup tags.
  • The tag describes document content.
  • HTML document contain HTML tags and plain text.
  • HTML document are also called web pages.
  • It is main language for creating web pages.
  • It is used predefined markup tags.
  • It is displayed by web browser.

The <!DOCTYPE> Declaration

  • The <!DOCTYPE> declaration helps the browser to display a web page correctly.
  • There are different document types on the web.
  • To display a document correctly, the browser must know both type and version.
  • The doctype declaration is not case sensitive. All cases are acceptable.