Basic HTML | Working with links Flashcards

1
Q

What does the target attribute do in anchor elements?

A

It tells the browser where to open the URL for the anchor element.

This is crucial for user navigation on websites.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

What is the default value of the target attribute?

A

_self

This opens the link in the current browsing context.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What does the target value _blank do?

A

Opens the link in a new browsing context.

Typically opens in a new tab, but can also open in a new window depending on user browser settings.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What is the function of the target value _parent?

A

Opens the link in the parent of the current context.

For instance, it opens in the main tab/window if used within an iframe.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

What does the target value _top do?

A

Opens the link in the top-most browsing context.

This means it opens in the full browser tab/window, regardless of nested frames.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

What is the fifth target value mentioned, and what is its purpose?

A

_unfencedTop

It is used for the experimental FencedFrame API and may not be relevant for general use yet.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Why is selecting the right target value important when creating a website?

A

It controls where users end up after clicking a link.

This can significantly affect user experience and navigation flow.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

What is a path in the context of file systems?

A

A path is a string that specifies the location of a file or directory in a file system.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

What are the two types of paths discussed?

A

Absolute paths and relative paths.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

What is an absolute path?

A

A complete link to a resource, starting from the root directory and including every directory, filename, and extension.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What does an absolute path include when linking to a resource on the web?

A

The protocol (http, https, file) and the domain name.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Provide an example of an absolute path.

A

https://design-style-guide.freecodecamp.org/img/fcc_secondary_small.svg

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

What is the root directory?

A

The top-level directory or folder in a hierarchy.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

How is an absolute path structured for a local file?

A

It includes the full path from the root directory to the filename.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

What is a relative path?

A

A path that specifies the location of a file relative to the directory of the current file.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

What does a relative path not include?

A

The protocol or the domain name.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

Provide an example of a relative path.

A

about.html

18
Q

When should you use absolute paths?

A

When linking to a resource hosted on an external website or when the link needs to work consistently regardless of document location.

19
Q

When should you use relative paths?

A

When linking to resources within the same website or when you want cleaner code.

20
Q

True or False: Relative paths are preferable during local testing.

21
Q

Fill in the blank: An absolute path includes the _______.

A

[root directory, all directories, filename, and extension]

22
Q

What is the benefit of using relative paths during development?

A

They keep the code cleaner and easier to maintain.

23
Q

What are file paths?

A

Special types of links that indicate the location of files and directories

24
Q

What is the first key syntax for file paths?

A

The slash, which can be a backslash () or forward slash (/)

25
What is the function of the slash in file paths?
It is known as the 'path separator' and indicates a break between folder or file names
26
What does a single dot (.) represent in file paths?
It points to the current directory
27
What does a double dot (..) represent in file paths?
It points to the parent directory
28
Why is a single dot typically used in file paths?
To ensure the path is recognized as a relative path
29
When are double dots (..) commonly used?
To access files outside of the current working directory
30
What is an example of a relative path using a single dot?
./favicon.ico
31
How would you access index.css from public/index.html using a relative path?
../src/index.css
32
Fill in the blank: The slash in file paths is known as the _______.
path separator
33
True or False: A single dot can be used to navigate to the parent directory.
False
34
What is the default state of a link?
:link ## Footnote Represents a link which the user has not visited, clicked, or interacted with yet.
35
What is the :visited state of a link?
Applies when a user has already visited the page being linked to ## Footnote By default, this state turns the link purple.
36
What does the :hover state indicate?
Applies when a user is hovering their cursor over a link ## Footnote Helps provide extra attention to a link.
37
What is the purpose of the :focus state?
Applies when we focus on a link ## Footnote Indicates that a link is currently selected or active.
38
What does the :active state represent?
Applies to links that are being activated by the user ## Footnote Typically means clicking on the link with the primary mouse button.
39
In what order should you write CSS for link states?
link, visited, hover, focus, active ## Footnote This order is important for proper styling of links.
40
True or False: The :visited state can provide a different visual indication using CSS.
True ## Footnote This can help indicate to users that they have already read a portion of the documentation.
41
Fill in the blank: The state that indicates a user is hovering over a link is called _______.
:hover
42
What is the significance of link states in web design?
They provide important information about the state of each link to the user ## Footnote Helps users understand their interaction history with links.