cbscribe/example.html

## example.html
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>hello title</title>
        <link href="style.css" rel="stylesheet">
    </head>
    <body>
        <h1>Section 1</h1>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Natoque penatibus et magnis dis parturient montes nascetur. Facilisi cras fermentum odio eu. At risus viverra adipiscing at in. Ac orci phasellus egestas tellus rutrum tellus pellentesque eu tincidunt. Blandit massa enim nec dui nunc mattis enim ut. Augue ut lectus arcu bibendum at varius vel. At augue eget arcu dictum varius duis. Duis ultricies lacus sed turpis. At augue eget arcu dictum. Egestas maecenas pharetra convallis posuere morbi leo urna molestie. Pretium vulputate sapien nec sagittis aliquam. Mattis nunc sed blandit libero volutpat sed cras ornare. Sit amet mattis vulputate enim. Eget nulla facilisi etiam dignissim diam quis enim lobortis scelerisque. Urna id volutpat lacus laoreet non curabitur. Sodales ut eu sem integer vitae justo eget magna fermentum. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna.</p>
        <img alt="A cute cat picture" src="cat_sm.jpg" width="100">
        <h2>Section 2</h2>
        <p>This is the second paragraph.
        <a href="https://google.com">Google</a></p>
        <form action="https://www.google.com/search">
            <input type="text" name="q">
            <input type="submit" name="Search">
        </form>
        <p>
            <ul>
                <li>Item 1</li>
                <li>Item 2</li>
                <li>Item 3</li>
            </ul>
        </p>

    </body>
</html>

## style.css
body
{
    background: slategray;
    color: white;
    font-family: sans-serif;
    font-size: 20px;
}

h1
{
    text-align: center;
}

h2
{
    text-align: center;
}

img
{
    float: right;
}

ul li::marker {
  content: "✅ ";
}
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<title>hello title</title>
	<link href="style.css" rel="stylesheet">
	</head>
	<body>
	<h1>Section 1</h1>
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Natoque penatibus et magnis dis parturient montes nascetur. Facilisi cras fermentum odio eu. At risus viverra adipiscing at in. Ac orci phasellus egestas tellus rutrum tellus pellentesque eu tincidunt. Blandit massa enim nec dui nunc mattis enim ut. Augue ut lectus arcu bibendum at varius vel. At augue eget arcu dictum varius duis. Duis ultricies lacus sed turpis. At augue eget arcu dictum. Egestas maecenas pharetra convallis posuere morbi leo urna molestie. Pretium vulputate sapien nec sagittis aliquam. Mattis nunc sed blandit libero volutpat sed cras ornare. Sit amet mattis vulputate enim. Eget nulla facilisi etiam dignissim diam quis enim lobortis scelerisque. Urna id volutpat lacus laoreet non curabitur. Sodales ut eu sem integer vitae justo eget magna fermentum. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna.</p>
	<img alt="A cute cat picture" src="cat_sm.jpg" width="100">
	<h2>Section 2</h2>
	<p>This is the second paragraph.
	<a href="https://google.com">Google</a></p>
	<form action="https://www.google.com/search">
	<input type="text" name="q">
	<input type="submit" name="Search">
	</form>
	<p>
	<ul>
	<li>Item 1</li>
	<li>Item 2</li>
	<li>Item 3</li>
	</ul>
	</p>

	</body>
	</html>
	body
	{
	background: slategray;
	color: white;
	font-family: sans-serif;
	font-size: 20px;
	}

	h1
	{
	text-align: center;
	}

	h2
	{
	text-align: center;
	}

	img
	{
	float: right;
	}

	ul li::marker {
	content: "✅ ";
	}