Friday, 16 November 2012

Dreamweaver session 2


To Open Again:
Sites
Manage Sites
Click on the pencil
Click on the folder
Done.
I should import files in the right hand corner at the bottom as last week.

cmd and tab. to switch to the internet




getting rid of the 5px white boarder on the website:
when using relative you will never be able to get the white boarder to disappear.
Aligned to the top left
DELETE:
 


Central Aligned:
 



Must be positioned Absolute 
margin-left: is half of the width of the webpage

You would make the DWT page which is a Dreamweaver Template that give you a structure that can be quickly applied to the website. Easy to edit.
Then you could clone it for all other web pages.
Big box is the editable region

anything visual inside the body tag.

To do this to any section you want to be the same on every page. inside the div in this case after the container go into Insert- Template Objects - Editable Region
 





Delete index HTML. we don't need it.

 

Save as a Template
Then open new template - create - save as work
Do this for every page you want : about. contact, etc.

Making Buttons
role over buttons. underline / italic / colour

Working in photoshop, background should be transparent.

Jpeg best image for the websites, you can choose the level of compression, but it doesn't let you have transparent.Photographs

Png 24 is a lot smaller. with transparent background

For a roll-over button you need to use Java Script.

 

 

Making a roll-over button
in template inside navigation click insert - image objects - rollover image
Fill out the box (screen shot) 
Do the same for every navigation button
and it should work, it just looks messy. This is Java script.

Typing into the design for each page so that we can see what is the homepage, contact, about and work when viewing on the web.


 
box model thinking about padding, margin and boarders when put in content. 

When adding padding into the whole of the box you ave to minus the amount of padding from the width and height.
10 px padding
-20px from height
-20 px from width


No comments:

Post a Comment