Difference between revisions of "Html certificate"
| (2 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
<html> | |||
<head> | |||
<title>Our first HTML page</title> | |||
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> | |||
</head> | |||
<body> | |||
<div class="pm-certificate-title cursive col-xs-12 text-center"> | |||
Buffalo Public Schools Certificate of Completion | |||
</div> | |||
<h1>Welcome to the web site: this is a heading inside of the heading tags.</h1> | |||
<p>This is a paragraph of text inside the paragraph HTML tags. We can just keep writting ... | |||
</p> | |||
<h3> | |||
This is another heading inside of another set of headings tags; this time the tag is an 'h3' instead of an 'h2' , that means it is a less important heading. | |||
</h3> | |||
<h4>Yet another heading - right after this we have an HTML list:</h4> | |||
<ol> | |||
<li>First item in the list</li> | |||
<li>Second item in the list</li> | |||
<li>Third item in the list</li> | |||
</ol> | |||
<p>You will notice in the above HTML list, the HTML automatically creates the numbers in the list.</p> | |||
<h3>About the list tags</h3> | |||
<p> | |||
HTML list tags are a little more complex than the other tags we have seen thus far. </p> | |||
<p> | |||
HTML list come in two flavors: ordered and unordered. Ordered list tags (<ol>) automatically inserts the right numbers for each of the list items (<li>), where as the unordered list tag (<ul>) inserts bullets.</p> | |||
<ul> | |||
<li>First item in the list</li> | |||
<li>Second item in the list</li> | |||
<li>Third item in the list</li> | |||
</ul> | |||
<h3>Now the most important HTML tag there is: the link tag!</h3> | |||
<p> | |||
This another web site worth visiting: <a href="http://www.killersites.com">www.killersites.com: Web design tutorials and forums</a> | |||
</p> | |||
</body> | |||
</html> | |||
<nowiki> | <nowiki> | ||
Latest revision as of 05:10, 1 July 2021
<html> <head>
<title>Our first HTML page</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head> <body>
Buffalo Public Schools Certificate of Completion
Welcome to the web site: this is a heading inside of the heading tags.
This is a paragraph of text inside the paragraph HTML tags. We can just keep writting ...
This is another heading inside of another set of headings tags; this time the tag is an 'h3' instead of an 'h2' , that means it is a less important heading.
Yet another heading - right after this we have an HTML list:
- First item in the list
- Second item in the list
- Third item in the list
You will notice in the above HTML list, the HTML automatically creates the numbers in the list.
About the list tags
HTML list tags are a little more complex than the other tags we have seen thus far.
HTML list come in two flavors: ordered and unordered. Ordered list tags (
- ) automatically inserts the right numbers for each of the list items (
- ), where as the unordered list tag (
- ) inserts bullets.
- First item in the list
- Second item in the list
- Third item in the list
Now the most important HTML tag there is: the link tag!
This another web site worth visiting: <a href="http://www.killersites.com">www.killersites.com: Web design tutorials and forums</a>
</body> </html>
<html> <body> <div class="container pm-certificate-container"> <div class="outer-border"></div> <div class="inner-border"></div> <div class="pm-certificate-border col-xs-12"> <div class="row pm-certificate-header"> <div class="pm-certificate-title cursive col-xs-12 text-center"> <h2>Buffalo Public Schools Certificate of Completion</h2> </div> </div> <div class="row pm-certificate-body"> <div class="pm-certificate-block"> <div class="col-xs-12"> <div class="row"> <div class="col-xs-2"><!-- LEAVE EMPTY --></div> <div class="pm-certificate-name underline margin-0 col-xs-8 text-center"> <span class="pm-name-text bold">TrueNorth Administrator</span> </div> <div class="col-xs-2"><!-- LEAVE EMPTY --></div> </div> </div> <div class="col-xs-12"> <div class="row"> <div class="col-xs-2"><!-- LEAVE EMPTY --></div> <div class="pm-earned col-xs-8 text-center"> <span class="pm-earned-text padding-0 block cursive">has earned</span> <span class="pm-credits-text block bold sans">PD175: 1.0 Credit Hours</span> </div> <div class="col-xs-2"><!-- LEAVE EMPTY --></div> <div class="col-xs-12"></div> </div> </div> <div class="col-xs-12"> <div class="row"> <div class="col-xs-2"><!-- LEAVE EMPTY --></div> <div class="pm-course-title col-xs-8 text-center"> <span class="pm-earned-text block cursive">while completing the training course entitled</span> </div> <div class="col-xs-2"><!-- LEAVE EMPTY --></div> </div> </div> <div class="col-xs-12"> <div class="row"> <div class="col-xs-2"><!-- LEAVE EMPTY --></div> <div class="pm-course-title underline col-xs-8 text-center"> <span class="pm-credits-text block bold sans">BPS PGS Initial PLO for Principals at Cluster Meetings</span> </div> <div class="col-xs-2"><!-- LEAVE EMPTY --></div> </div> </div> </div> <div class="col-xs-12"> <div class="row"> <div class="pm-certificate-footer"> <div class="col-xs-4 pm-certified col-xs-4 text-center"> <span class="pm-credits-text block sans">Buffalo City School District</span> <span class="pm-empty-space block underline"></span> <span class="bold block">Crystal Benton Instructional Specialist II, Staff Development</span> </div> <div class="col-xs-4"> <!-- LEAVE EMPTY --> </div> <div class="col-xs-4 pm-certified col-xs-4 text-center"> <span class="pm-credits-text block sans">Date Completed</span> <span class="pm-empty-space block underline"></span> <span class="bold block">DOB: </span> <span class="bold block">Social Security # (last 4 digits)</span> </div> </div> </div> </div> </div> </div> </div> </body> </html>