Transcription
Creating A Webpage Using HTML & CSSBriefintroduction.Listkeylearningoutcomes: obeDreamweaver. aphsintoawebpageusingtheappropriatetags. obePhotoshop. page.TodothisgotoFile ndcorneroftheDreamweaverprogram.
rmyspecificwebsite,developedforanon- asfollowed: Header1:“SALUD” Header2:“SaveaLife,UnderstandDisease” easeisaservice- derstandingdisease.” tpanelofthescreen.Itshouldlooklikeso:
Noticehoweachsectionisnestledbetweentwotags( p and /p ehowintheleftpanel,thetagschangedfrom p and /p to h1 and /h1 �heading5”tag.
CSSdocumentbygoingtoFile New CSS.Next,savethefilebygoingtoFile ,clickrightafterthe body tag.Insertabreakinthecodebypressing
returnonthekeyboard.Then,typethefollowingtag: divid ”h1” /div uldnowlooklikethis:Now,clickinthecenterofthetag( ).Then,youaregoingtoclickthe“link”button( css”andpressOK.
tab,andclickthe“add”button( ize,fontfamily,andthefontcolor.Now,simplyselect h1 SALUD /h1 andcutandpastedirectlyinto divid ”h1” /div naction!
nView
UTF- ‐8";/*CSSDocument*/body{color:#39Fline- ‐height:1.5em;font- o,serif;font- ‐size:16px;background- ‐color:#09F;}.page{max- tive;background- ‐color:#FFF;}h1{font- ‐size:2em;font- t- ‐size:2em;font- yourbodyhtmltag)willappearthatcolor.
tagsinyourHTML: center /center Forexample,tocenteryourh1tagyouwillwrite: h1 center SALUD /center /h1 Comparedto: h1 SALUD /h1 vedtothedesktop!TheeasiestwaytodothisisgotoInsert om:http://www.lynda.com/Dreamweaver- ‐tutorials/Dreamweaver- ‐CS6- ‐WordPress- ‐38- ‐Core- ‐Concepts/161459- ‐2.htmlhttp://www.lynda.com/Web- ‐Interactive- ‐CSS- ‐tutorials/CSS- ‐Fundamentals/80436- ‐2.html?srchtrk nce%0Asa:true%0Aproducttypeid:2
abSpring,2015
e New& CSS.& Next,&save&the&file&by&going&to&File& &SaveAs&and&namingyour&file “salud.css”.Youwillthenneedtoattachy our&newlycreatedCSSfileto &and intheleftpanel,&
