Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Special Purpose Text Markup | Tags and Attributes
Ultimate HTML
course content

Course Content

Ultimate HTML

Ultimate HTML

1. Web Development
2. Tags and Attributes
3. Document Structure
4. Media and Tables
5. Forms

bookSpecial Purpose Text Markup

Link

The <a> tag is used to create hyperlinks that enable users to navigate between different web pages. When a user clicks on a link, the browser sends a request to the server for the page associated with the link and displays the response on the screen. The href attribute helps specify the URL of the destination page.

html

index

css

index

js

index

copy

Link Attributes:

target

By default, the link opens in the same browser tab. The target attribute allows us to modify this behavior. To open a link in a new tab, use target="_blank".

html

index

css

index

js

index

copy

download

The download attribute can be used with the HTML <a> tag to specify that the target resource should be downloaded instead of displayed in the browser. When the download attribute is used, the browser prompts the user to save the file with the specified filename. For example, if we need to create an element with the following functionality: when the user clicks on the link, the browser will download the myfile.pdf file from https://example.com/ and prompt the user to save it with the filename myfile.pdf.

html

index

css

index

js

index

copy

href

The href attribute is used not only to navigate to other pages but also to create links to email addresses, telephone numbers, and specific sections.

html

index

css

index

js

index

copy

Additionally, the href attribute can be utilized to navigate to specific sections within a web page. To create an anchor tag, assign an id attribute (a unique identifier) to the desired section we want to scroll to. The href attribute takes a value starting with the # symbol followed by the id value.

Let's explore the following example, presented in the form of CodeSandbox. This platform enables code inspection and allows you to examine the code's functionality.

Note

Please take a moment to inspect the functionality by clicking on the links and observing how the live page scrolls to the specific sections. Additionally, pay attention to the attributes of the a tag and the h2 tag.

Button

The <button> tag in HTML is used to create a clickable button that can trigger an action, such as submitting a form, executing a JavaScript function like opening and closing a pop-up window, or toggling a mobile menu. By default, the <button> has the type attribute, and its value is submit. However, we often need to specify type="button".

html

index

css

index

js

index

copy

Note

The <a> tag is used for creating hyperlinks to other web pages, documents, or resources. In contrast, the <button> tag is used for creating interactivity on a web page, triggering an event, or performing an action. It's essential not to mix their purposes.

1. Can we open a new tab/window with a `<button>` tag?
2. Can we use a `<button>` tag to submit a form?
3. What is the main difference between the `<a>` tag and the `<button>` tag?
Can we open a new tab/window with a `<button>` tag?

Can we open a new tab/window with a <button> tag?

Select the correct answer

Can we use a `<button>` tag to submit a form?

Can we use a <button> tag to submit a form?

Select the correct answer

What is the main difference between the `<a>` tag and the `<button>` tag?

What is the main difference between the <a> tag and the <button> tag?

Select the correct answer

Everything was clear?

How can we improve it?

Thanks for your feedback!

Section 2. Chapter 9
some-alt