Knowledge in HTML Lists
HTML Picture Element
HTML Picture Element The picture element allows us to display different pictures for different devices or screen sizes. ________________________________________
yash sharma
HTML The id Attribute
Using The id Attribute The id attribute specifies a unique id for an HTML element (the value must be unique within the HTML document). The id value can be used by CSS and JavaScript to perform certain tasks for the element with the specific id value. In CSS, to select an element with a specific id, write a hash (#) character, followed by the id of the element: Example Use CSS to style an element with the id "myHeader": #myHeader { background-color: lightblue; color: black; padding: 40px; text-align: center; } My Header Result: My Header Try it Yourself » Tip: The id attribute can be used on any HTML element. Note: The id value is case-sensitive. Note: The id value must contain at least one character, and must not contain whitespace (spaces, tabs, etc.). ________________________________________
HTML Image Maps
HTML Image Maps With image maps, you can add clickable areas on an image. ________________________________________ Image Maps The tag defines an image-map. An image-map is an image with clickable areas. Click on the computer, the phone, or the cup of coffee in the image below:
HTML JavaScript
HTML JavaScript JavaScript makes HTML pages more dynamic and interactive. Example My First JavaScript Click me to display Date and Time Try it Yourself » ________________________________________ The HTML Tag The tag is used to define a client-side script (JavaScript). The element either contains script statements, or it points to an external script file through the src attribute. Common uses for JavaScript are image manipulation, form validation, and dynamic changes of content. To select an HTML element, JavaScript most often uses the document.getElementById() method. This JavaScript example writes "Hello JavaScript!" into an HTML element with id="demo": Example document.getElementById("demo").innerHTML = "Hello JavaScript!"; Try it Yourself » Tip: You can learn much more about JavaScript in our JavaScript Tutorial. ________________________________________
HTML Layouts
HTML Layout Example Cities • London • Paris • Tokyo London London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants. Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium. Footer Try it Yourself » ________________________________________ HTML Layout Elements Websites often display content in multiple columns (like a magazine or newspaper). HTML offers several semantic elements that define the different parts of a web page:
HTML Links
HTML Links Links are found in nearly all web pages. Links allow users to click their way from page to page. ________________________________________ HTML Links - Hyperlinks HTML links are hyperlinks. You can click on a link and jump to another document. When you move the mouse over a link, the mouse arrow will turn into a little hand. Note: A link does not have to be text. It can be an image or any other HTML element. ________________________________________ HTML Links - Syntax Hyperlinks are defined with the HTML tag: link text Example Visit our HTML tutorial » The href attribute specifies the destination address (https://www.w3schools.com/html/) of the link. The link text is the visible part (Visit our HTML tutorial). Clicking on the link text will send you to the specified address. Note: Without a forward slash at the end of subfolder addresses, you might generate two requests to the server. Many servers will automatically add a forward slash to the end of the address, and then create a new request. ________________________________________