Explore HTML and CSS Relationship - Day 4

 

 CSS and HTML Relationship Movie 4 [19:10m]: Play Now | Play in Popup | Download

• Goal
  • Understand how to download, edit and save an image to media folder and place in web page
• Product
  • HTML document with images included
  • Sample CSS from the above example:

    • body {background-color: yellow}
      p {color:blue}
       {background-color: #00ff00;
      	color: salmon;
      	font-size: 400%}
      h2 {background-color: transparent}
      
      #divbox {
      		width: 300px;
      		height: 300px;
      		border: medium double #333333;
      		background-color:#FF33FF;
      		}
      
      #container {
      		width: 1024px;
      		height: 682px;
      		border: medium double #666666;
      		background-color:#999999;
      		margin: 0px auto;
      		background-image:url('media/flower.jpg');
      		overflow:scroll;
      		margin-top: 50px;
      		}

• Tools
  • Flickr.com for Creative Commons Texture Images
  • Adobe Dreamweaver
    
  • Adobe Photoshop
    
  • GIMP - Free Open Source Image Editor
    
  • Kompozer - Web Development Program
    
• Resources
  • Day4_Website Folder
  • W3schools.com link code

Tags: CSS, HTML, Tutorial, Web Design