Scribd
Upload
2 views

HTML_Tutorial_

The document provides various HTML and CSS examples for creating buttons, links, images, lists, and formatting text. It includes instructions on using attributes like 'alt', styling elements, and creating hyperlinks, along with details on text formatting tags. Additionally, it covers CSS properties for borders, padding, and margins.

Uploaded by

ys304123
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
2 views

HTML_Tutorial_

The document provides various HTML and CSS examples for creating buttons, links, images, lists, and formatting text. It includes instructions on using attributes like 'alt', styling elements, and creating hyperlinks, along with details on text formatting tags. Additionally, it covers CSS properties for borders, padding, and margins.

Uploaded by

ys304123
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

To create a button:

<button>Click me</button>

To create a link:

<a href="https://www.w3schools.com">This is a link</a>

To upload an image:

<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">

To create a list:

<li>Coffee</li>

<li>Tea</li>

<li>Milk</li>

To assign numbers to a list:

<ol>

<li>Coffee</li>

<li>Tea</li>

<li>Milk</li>

</ol>

To assign dots to a list:

<ul>

<li>Coffee</li>

<li>Tea</li>

<li>Milk</li>

</ul>

Lists contain three tags:

<dl>, <dt>, and <dd>


How to use the alt attribute:

<img src="img_girl.jpg" alt="Girl with a jacket" width="500" height="600">

To get a horizontal line:

<hr> just use it wherever you want

To break a sentence:

<br>

To assign heading size or color to a sentence:

<h1 style="font-size:60px;"></h1>

<p style="color:red;"></p>

To write a point in a paragraph:

<pre></pre>

To add background color (can only be added to the body):

<body style="background-color:powderblue;">

To center a sentence:

<h1 style="text-align:center;">Centered Heading</h1>

<p style="text-align:center;">Centered paragraph.</p>

To convert text to bold:

<p><b>This text is bold</b></p>

To convert text to italic:

<p><i>This text is italic</i></p>

<b> - Bold text

<strong> - Important text

<i> - Italic text

<em> - Emphasized text

<mark> - Marked text

<small> - Smaller text


<del> - Deleted text

<ins> - Inserted text

<sub> - Subscript text

<sup> - Superscript text

To write a sentence in reverse:

<bdo dir="rtl">This line will be written from right to left</bdo>

To add a quotation to a sentence:

<q></q>

For border styles:

border:8px solid orange;

Use CSS padding for space inside the border:

padding:20px;

Use CSS margin for space outside the border:

margin:20px;

For hyperlinks:

The target attribute specifies where to open the linked document.

<a href="https://www.w3schools.com/" target="_blank">Visit W3Schools!</a>

To create a mailto link:

<p><a href="mailto:[email protected]">Send email</a></p>

To assign a link to a button:

<button onclick="document.location='default.asp'">HTML Tutorial</button>

... (content continues)

You might also like