With the increasing reliance on JavaScript frameworks and libraries, many people pay less attention to HTML. . This results in us not being able to take full advantage of many features of HTML, which can greatly enhance website functionality. Also by writing semantic HTML you can add the correct context to your website content, significantly improving the user experience.
This article will introduce some useful HTML tags that you may have overlooked. The
<base>
<base> tag allows you to create a scenario where there is a base URL that acts as the Prefix for all relative URLs. The tag must have a href or target attribute that contains the base URL, or both.
<!DOCTYPE html>
<html>
<head>
<base href="https://www.google.com/" target="_blank">
</head>
<body>
<h1>The base element(Google As a case study)</h1>
<p> <a href="gmail">Gmail</a> - Used to send emails; which are messages distributed by electronic means from one computer user to one or more recipients via a network.</p>
<p><a href="hangouts">Hangouts</a> - It's used for Messaging, Voice and Video Calls</p>
</body>
</html>
Copy after login
This way you don’t have to repeat the URL prefix for each request.
There can only be one <base> element in an HTML document, and it must be located within the <head> element.
Image map
Image map is an image with a specific clickable area and is defined through the map tag. These areas are set up using the <area> tag. This allows you to embed links in different parts of the image, which can lead to other pages, which is useful for describing what is in the image.
Look at an example:
The first step is to insert the image using the <img alt="Useful HTML tags you might ignore (summary)" > tag as usual, but this time using the usemap attribute .
Use the <area> element to define clickable areas on the image. It is added inside the map element.
These properties include:
shape is required when drawing a rectangle over the relevant area. You can use other shapes such as rectangle, circle, polygon or the default shape (whole image)
alt is used to specify when the area element is Alternate text to be displayed when rendering fails
href Contains a URL linking the clickable area to another page
coords using coordinates (starting with (in pixels) to cut out shapes accurately. You can use various software to obtain the exact coordinates of an image; Microsoft's drawing software is used below as a simple example. Different shapes represent their coordinates in different ways. For example, a rectangle is represented by left, top, right, bottom.
Here we have top, left Coordinates:
You can find the The lower left corner reads the coordinates of the cursor on the picture, or you can just use the ruler on the horizontal and vertical planes.
The screenshot below shows the right, bottom coordinates:
The coordinates of the center of the circle Agreeing to be located in the lower left corner, the horizontal distance from the center to the end of the circle is the radius. Creating a
poly is more like drawing freehand. You just link different points on the image and they will be connected:
<p><dfn title="HyperText Markup Language">HTML</dfn>
Is the standard markup language for creating web pages.
</p>
Copy after login
也可以与 <abbr> 结合使用：
<!DOCTYPE html>
<html>
<body>
<p><dfn><abbr title="HyperText Markup Language">HTML</abbr></dfn>
It's the standard markup language for creating web pages.</p>
</body>
</html>
Copy after login
这可以增强可访问性，因为这样编写语义 HTML 可以使阅读器和浏览器在适合用户的上下文中解释页面上的内容。
<details>
<summary>
<span>I am an introvert</span>
</summary>
<div>An introvert is a person with qualities of a personality type known as introversion, which means that they feel more comfortable focusing on their inner thoughts and ideas, rather than what's happening externally. They enjoy spending time with just one or two people, rather than large groups or crowds</div>
<div>
</details>
Copy after login
<cite> 和 <blockquote>
基本上 <blockquote> 是从另一个来源引用的部分。并添加了 <cite> 属性来指示源。
<blockquote cite="https://en.wikipedia.org/wiki/History_of_Nigeria">
The history of Nigeria can be traced to settlers trading across the middle East and Africa as early as 1100 BC. Numerous ancient African civilizations settled in the region that is known today as Nigeria, such as the Kingdom of Nri, the Benin Empire, and the Oyo Empire. Islam reached Nigeria through the Borno Empire between (1068 AD) and Hausa States around (1385 AD) during the 11th century,[1][2][3][4] while Christianity came to Nigeria in the 15th century through Augustinian and Capuchin monks from Portugal. The Songhai Empire also occupied part of the region.[5]
</blockquote>
<p>The best movie ever made is <cite>The Godfather</cite> by
Francis Ford Coppola . My favorite song is <cite>Monsters You Made</cite> by the Burna boy.</p>
The above is the detailed content of Useful HTML tags you might ignore (summary). For more information, please follow other related articles on the PHP Chinese website!
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
