Scribd
Upload
3 views4 pages

HTML & CSS Code Examples with Outputs

The document provides 10 HTML examples and 15 CSS examples, each with corresponding outputs. HTML examples include elements like headings, paragraphs, links, images, lists, tables, buttons, inputs, forms, and divs. CSS examples demonstrate styling properties such as text color, background, font size, alignment, borders, margins, padding, dimensions, button colors, hover effects, display types, shadows, border radius, and opacity.

Uploaded by

akshayprajapti02
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
3 views4 pages

HTML & CSS Code Examples with Outputs

The document provides 10 HTML examples and 15 CSS examples, each with corresponding outputs. HTML examples include elements like headings, paragraphs, links, images, lists, tables, buttons, inputs, forms, and divs. CSS examples demonstrate styling properties such as text color, background, font size, alignment, borders, margins, padding, dimensions, button colors, hover effects, display types, shadows, border radius, and opacity.

Uploaded by

akshayprajapti02
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

HTML & CSS Examples (With Output)

10 HTML Examples
Heading
<h1>Hello World</h1>
Output: Displays a large heading text 'Hello World'.

Paragraph
<p>This is a paragraph.</p>
Output: Shows a normal text paragraph.

Link
<a href='[Link]
Output: Creates a clickable link.

Image
<img src='[Link]' alt='img'>
Output: Displays an image.

List
<ul><li>A</li><li>B</li></ul>
Output: Shows a bullet list.

Table
<table><tr><td>A</td></tr></table>
Output: Creates a simple table.

Button
<button>Click</button>
Output: Displays a clickable button.

Input
<input type='text'>
Output: Shows a text input box.

Form
<form><input></form>
Output: Creates a basic form.

Div
<div>Box</div>
Output: Creates a block container.
15 CSS Examples
Text Color
p { color: red; }
Output: Paragraph text becomes red.

Background
div { background: yellow; }
Output: Div background turns yellow.

Font Size
h1 { font-size: 40px; }
Output: Heading becomes large.

Center Text
p { text-align: center; }
Output: Text moves to center.

Border
div { border: 2px solid black; }
Output: Adds border around div.

Margin
div { margin: 20px; }
Output: Space outside element.

Padding
div { padding: 10px; }
Output: Space inside element.

Width
div { width: 200px; }
Output: Fixes element width.

Height
div { height: 100px; }
Output: Fixes element height.

Button Color
button { background: blue; }
Output: Button turns blue.
Hover
a:hover { color: green; }
Output: Link color changes on hover.

Display
span { display: block; }
Output: Inline becomes block.

Shadow
div { box-shadow: 2px 2px 5px; }
Output: Adds shadow.

Radius
div { border-radius: 10px; }
Output: Rounded corners.

Opacity
div { opacity: 0.5; }
Output: Makes element transparent.

You might also like