HTML Flashcards
(28 cards)
HTML full form
Hyper Text mark up language
use of JavaScript:
Make it interactive.
tag
<>
element
<p> is the opening tag.
Hello World! is the content.
</p>
is the closing tag.
<p>
</p>
paragraph element
<body>
</body>
element defines an HTML document’s “body” and it’s where any content that we want to display to the user will be held
headings
<h1> heading element
</h1>
level of heading
There are six levels of headings, from <h1> to <h6>:
<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>
Line break
<br></br> break tag
bold
italicize
underline
strikethrough
<b>
<i>
<u></u></i></b>
<s>
</s>
two types of list
<ul> Unordered lists
<ol> Ordered lists
eg:
<ol>
<li>Power ⚡</li>
<li>Courage 🔥</li>
<li>Wisdom 🦉</li>
</ol>
</ol></ul>
anchor tag
hyperlink
eg:
<a>Internet Archive</a>
href
An href, or hyperlink reference, is a reference or pointer to another website that is linked in our HTML.
image
<p>Here's a cute pic:</p>
<img></img>
Documentation type declaration
<!DOCTYPE html>
<html>
Code goes here
</html>
Inside <html>, there should be two elements:
<head> contains all the info for your browser that's not visible on the page.
<body> contains all of the content that you will end up seeing on the page.
</body></head>
comments
Everything surrounded by the <!-- and --> comment markers is ignored and not rendered on the browser
Attributes
<element>Content</element>
Attributes in Image Tag
width=”250”
If our image can’t appear for some reason, the alt text is displayed instead!
Attribute in Anchor Tag
<img src=https://tse2.mm.bing.net/th?id=OIP.VObaoIAjWjttB-VbLeTvKQHaF4&w=376&h=376&c=7>
<p> <b>Pradeep Kumar</b> is a renowned Indian playback singer and music director, celebrated for his contributions to Tamil cinema.<br></br> Throughout his career, Pradeep has collaborated with prominent composers such as <i>Santhosh Narayanan and Sean Roldan</i>, lending his soulful voice to numerous hit songs. His versatility and emotive singing style have earned him a special place in <u>the hearts of music enthusiasts.</u><p>
<p><b>INSTA:</b> <a href=https://www.instagram.com/pradeep_kumar1123/?hl=en> Pradeep Kumar<a></a></p>
<p><b>Members</b></p>
</p></p>
use roman in list
<ol>
<li>Power ⚡</li>
<li>Courage 🔥</li>
<li>Wisdom 🦉</li>
</ol>
Attribute in Anchor Tag
<a>Codédex</a>
<a>Codédex</a>
We can also use the target attribute and set it to “_blank” to make the link open in a new browser tab:
Attributes in Image Tag
<img></img>
<img></img>
class and id
A good way to remember class vs id is… there can be multiple students in a class, but each student should have an unique id.
