Advertisement
kuruku

PowerPoint

Jun 4th, 2014
254
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 3.42 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <!--
  3. Create a Web page that looks like this PowerPoint slide
  4. (100% accuracy is not required):
  5.  
  6. -->
  7. <html>
  8.     <head>
  9.         <title>PowerPoint</title>
  10.         <meta charset="UTF-8">
  11.         <meta name="viewport" content="width=device-width, initial-scale=1.0">
  12.         <style>
  13.             body{
  14.                 font-family:Calibri;
  15.             }
  16.             div {
  17.                 margin:20px auto;
  18.                 width:850px;
  19.                 //background: red;
  20.             }
  21.             .text {
  22.                 position: absolute;
  23.                 top:10px;
  24.                 left:540px;
  25.                  width:800px;
  26.                  padding:10px;
  27.             }
  28.            
  29.             h1{
  30.                 color:#f3cd60;
  31.                 font-weight: none;
  32.                 margin-bottom:10px;
  33.             }
  34.             h2{
  35.                 color:#f3cd60;
  36.                 font-weight: none;
  37.             }
  38.             li{
  39.                 color:#f3be60;
  40.             }
  41.             span{
  42.                 color: white;
  43.             }
  44.            
  45.             .box{
  46.                 margin-left:60px;
  47.                 width:715px;
  48.                 padding:5px;
  49.                 background: #747065;
  50.                 padding-left: 5px;
  51.                 opacity: 0.5;
  52.                 border:1px solid yellow;
  53.                 margin-top:-10px;
  54.                 margin-bottom:10px;
  55.             }
  56.            
  57.             .box div p{
  58.                 color:#fbeec9;
  59.                 margin:0;
  60.             }
  61.             .box div{
  62.                 margin:0;
  63.             }
  64.             ul{
  65.                 margin-top:10px;
  66.                 margin-bottom:10px;
  67.             }
  68.            
  69.            
  70.         </style>
  71.     </head>
  72.    
  73.     <body>
  74.        
  75.         <div >
  76.              <img src="power.png">
  77.              <div class = "text">
  78.                  <h1>Headings and Paragraphs</h1>
  79.                  <ul type = "square">
  80.                      <li><h2><span>Heading Tags:</span> &#60;h1&#62; <span>&#45;</span> &#60;&#47;h6&#62;</h2></li>
  81.                  </ul>
  82.                  <div class="box">
  83.                      <div>
  84.                         <p> &#60;h1&#62; Heading 1&#60;&#47;h1&#62;<br/>
  85.                          &#60;h2&#62; Sub heading 2 &#60;&#47;h2&#62;<br/>
  86.                         &#60;h3&#62; Sub heading 3 &#60;&#47;h3&#62;</p>
  87.                      </div>
  88.                  </div>
  89.                  <ul type = "square">
  90.                      <li><h2><span>Paragraph Tags:</span> &#60;p&#62; <span></h2></li>
  91.                  </ul>
  92.                  <div class="box">
  93.                      <div>
  94.                         <p> &#60;p&#62; This is my first paragraph &#60;&#47;p&#62;</p>
  95.                         <p>&#60;p&#62; This is my second paragraph &#60;&#47;p&#62;</p>
  96.                      </div>
  97.                  </div>
  98.                   <ul type = "square">
  99.                      <li><h2><span>Sections:</span> &#60;div&#62; <span>and</span> &#60;&#47;span&#62;</h2></li>
  100.                  </ul>
  101.                  <div class="box">
  102.                      <div>
  103.                         <p> &#60;div style&#61;&#34;background&#58; skyblue&#59; &#34; &#62;<br/>
  104.                            &#32;&#32;&#32;This is div<br/>
  105.                         &#60;div &#62;</p>
  106.                      </div>
  107.                  </div>
  108.              </div>
  109.            
  110.            
  111.         </div>
  112.     </body>
  113. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement