{"id":2374,"date":"2017-10-06T04:56:36","date_gmt":"2017-10-06T04:56:36","guid":{"rendered":"http:\/\/isophal.info\/?p=2374"},"modified":"2017-10-06T05:12:17","modified_gmt":"2017-10-06T05:12:17","slug":"unit-02-html-structure-using-lists","status":"publish","type":"post","link":"https:\/\/isophal.com\/news\/2017\/10\/06\/2374.html\/","title":{"rendered":"Unit 02 HTML Structure using lists"},"content":{"rendered":"

1. Introduction<\/h1>\n
<!DOCTYPE html>  \r\n<html>  \t\r\n<head>  \t\t\r\n<title>Soundcloud<\/title>  \t\r\n<\/head>  \t\r\n<body>  \t\t\r\n<p>Electronic<\/p>  \t\r\n<\/body>  \r\n<\/html>\r\n<\/pre>\n
2. Indentation is your friend<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n\t<head>\r\n\t\t<title><\/title>\r\n\t<\/head>\r\n\t<body>\r\n\t<\/body>\r\n<\/html><\/pre>\n
3. Ordered lists<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n\t<head>\r\n\t\t<title>Lists<\/title>\r\n\t<\/head>\r\n\t<body>\r\n\t\t<h1>List of my favorite things<\/h1>\r\n\t\t\t<ol>\r\n\t\t\t\t<li>raindrops on roses<\/li>\r\n\t\t\t\t<li>whiskas on kittens<\/li>\r\n\t\t\t\t<li>call of duty: modern warfare<\/li>\t\t\t\t\r\n\t\t\t<\/ol>\r\n\t\t<h2>List of things I find OK<\/h2>\r\n\t\t    <ol>\r\n    \t     <li>OK<\/li>\r\n             <li>KO<\/li>  \r\n             <li>OKOK<\/li>\r\n\t\t    <\/ol>\r\n        \r\n\t<\/body>\r\n<\/html><\/pre>\n
4. One more ordered list<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n\t<head>\r\n\t\t<title>Soundclound<\/title>\r\n\t<\/head>\r\n\t<body>\r\n     <h3>Most annoying TV celebrities<\/h3>   \r\n     <ol>\r\n         <li>Celeb1<\/li>\r\n         <li>Celeb2<\/li>\r\n         <li>Celeb3<\/li>\r\n     <\/ol>\r\n     <h2>Top 3 things I can do for Mother's Day.<\/h2>\r\n     <ol>\r\n         <li>Be polite<\/li>\r\n         <li>Be honest<\/li>\r\n         <li>Be nice<\/li>\r\n     <\/ol>\r\n\t<\/body>\r\n<\/html><\/pre>\n
5. Unordered lists<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n\t<head>\r\n\t\t<title>Unordered Lists<\/title>\r\n\t<\/head>\r\n\t<body>\r\n     <h1>Some random thoughts<\/h1>\r\n     <p>Lorem Ipsum.<\/p>\r\n     <ul>\r\n         <li>One<\/li>\r\n         <li>Two<\/li>\r\n         <li>Three<\/li>\r\n         <li>Four<\/li>\r\n     <\/ul>\r\n\t<\/body>\r\n<\/html><\/pre>\n
6. Lists inside a list<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n\t<head>\r\n\t\t<title>Nested lists<\/title>\r\n\t<\/head>\r\n\t<body>\r\n\t\t<ol>\r\n\t\t\t<li>Dad's interests\r\n\t\t\t\t<ul>\r\n\t\t\t\t\t<li>Football<\/li>\r\n\t\t\t\t\t<li>Series<\/li>\r\n\t\t\t\t<\/ul>\r\n\t\t\t<\/li>\r\n\t\t\t<li>Mom's interests\r\n\t\t\t\t<ul>\r\n\t\t\t\t\t<li>Cooking<\/li>\r\n\t\t\t\t\t<li>Series<\/li>\r\n\t\t\t\t<\/ul>\r\n\t\t\t<\/li>\r\n\t\t<\/ol>\r\n\t\t<ol>\r\n    \t <ul>\r\n            <li>Favorite Boys' Names<\/li>\r\n            <ol>\r\n                <li>David<\/li>\r\n                <li>John<\/li>\r\n                <li>Patrick<\/li>\r\n            <\/ol>\r\n            <li>Favorite Girls' Names.<\/li>\r\n            <ol>\r\n                <li>Anna<\/li>\r\n                <li>Maria<\/li>\r\n                <li>Carol<\/li>\r\n            <\/ol>\r\n        <\/ul>\r\n\t\t<\/ol>\r\n\t<\/body>\r\n<\/html><\/pre>\n
7. Introduction<\/h3>\n
Make me into a comment<\/b><\/p>\n
<p>But leave me visible to the user!<\/p>\r\n\r\n<!-- comment --><\/pre>\n
8. Font size<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n\t<head>\r\n\t\t<title>First font size change<\/title>\r\n\t<\/head>\r\n\t<body>\r\n\t\t<p style = \"font-size: 10px\"> Some text for you to make tiny! <\/p>\r\n\t\t<p style = \"font-size: 20px\"> Some text for you to make normal size!<\/p>\r\n\t\t<p style = \"font-size: 40px\"> Some text for you to make super big!<\/p>\r\n\t<\/body>\r\n<\/html><\/pre>\n
9. Font color<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n    <head>\r\n        <title>Changing the colors!<\/title>\r\n    <\/head>\r\n    <body>\r\n        <h1 style=\"color: green; font-size:16px\">Big Heading<\/h1>\r\n            <p style=\"color: violet;\">A giant bear and a little duck were friends.<\/p>\r\n            <p style=\"color: red; font-size:10px\">But the bear got hungry and ate the duck.<\/p>\r\n    <\/body>\r\n<\/html><\/pre>\n
10. Font family<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n    <head>\r\n        <title>Loving the font changes<\/title>\r\n    <\/head>\r\n    <body>\r\n        <h1>Big title<\/h1>\r\n         <ol>\r\n            <li style=\"font-family:Arial; font-size:16px\">This item is big Garamond.<\/li>\r\n            <li style=\"font-family:Verdana; font-size:12px\">This item is medium Bodoni.<\/li>\r\n            <li style=\"font-family:Impact; font-size:10px\">This item is small Futura<\/li>\r\n         <\/ol>\r\n    <\/body>\r\n<\/html><\/pre>\n
11. Recap<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n    <head>\r\n        <title>Putting it all together<\/title>\r\n    <\/head>\r\n    <body>\r\n        <p style=\"font-size: 20px; color: blue; font-family:Arial;\">A truly spectacular paragraph!<\/p>\r\n    <\/body>\r\n<\/html><\/pre>\n
12. Background color<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n\t<head>\r\n\t\t<title>Sexy background color!<\/title>\r\n\t<\/head>\r\n\t<body style=\"background-color:brown\">\r\n\t\t<h3>Favorite Football Teams<\/h3>\r\n\t\t\t<ol style=\"background-color:yellow\">\r\n\t\t\t\t<li>The Hawthorn Football Club<\/li>\t\r\n\t\t\t\t<li>San Franscisco 49ers<\/li>\r\n\t\t\t\t<li>Barcelona FC<\/li>\r\n\t\t\t<\/ol>\t\t\t\r\n\t<\/body>\r\n<\/html><\/pre>\n
13. Aligning the text<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n<head>\r\n\t<title>Sexy background color!<\/title>\r\n<\/head>\r\n<body>\r\n\t<h3 style=\"text-align:center\">Favorite Football Teams<\/h3>\r\n\t<ol>\r\n\t\t<li style=\"text-aling:left\">The Hawthorn Football Club<\/li>\t\r\n\t\t<li style=\"text-align:center\">San Franscisco 49ers<\/li>\r\n\t\t<li style=\"text-align:right\">Barcelona FC<\/li>\r\n\t<\/ol>\t\t\t\r\n<\/body>\r\n<\/html><\/pre>\n
14. Strong words!<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n    <head>\r\n        <title>Viva La Revolution!<\/title>\r\n    <\/head>\r\n    <body>\r\n        <p><strong>sing<\/strong><\/p>\r\n        <p><strong>too<\/strong><\/p>\r\n    <\/body>\r\n<\/html><\/pre>\n
15. Emphasize words!<\/h3>\n
<!DOCTYPE html>\r\n<html>\r\n\t<head>\r\n\t\t<title>Some nice practice<\/title>\r\n\t<\/head>\r\n\t<body>\r\n\t\t<p>Hey, don't say <em>that<\/em>!<\/p>\r\n\t\t<p>I am <em>so<\/em> tired.<\/p>\r\n\t<\/body>\r\n<\/html><\/pre>\n","protected":false},"excerpt":{"rendered":"
1. Introduction <!DOCTYPE html> <html> <head> <title>Soundcloud<\/title>…<\/p>\n","protected":false},"author":1,"featured_media":2375,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[],"class_list":["post-2374","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html"],"_links":{"self":[{"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/posts\/2374","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/comments?post=2374"}],"version-history":[{"count":7,"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/posts\/2374\/revisions"}],"predecessor-version":[{"id":2383,"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/posts\/2374\/revisions\/2383"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/media\/2375"}],"wp:attachment":[{"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/media?parent=2374"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/categories?post=2374"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/isophal.com\/news\/wp-json\/wp\/v2\/tags?post=2374"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}