Thiết kế website bằng phần mềm Adobe Dreamweaver CS5 - P1

Adobe Dreamweaver là một công cụ xử lý mạnh mẽ dành cho những người thiết kế web, người dùng có thể tự mình lập trình và phát triển ứng dụng web ở nhiều cấp độ. Nếu chỉ dừng ở mức độ hiểu biết chưa nhiều về các ngôn ngữ lập trình web thì Dreamweaver vẫn đáp ứng được nhu cầu thiết kế Website chuyên nghiệp.
Nội dung trích xuất từ tài liệu:
Thiết kế website bằng phần mềm Adobe Dreamweaver CS5 - P1 Thiết kế website bằng phần mềm Adobe DreamweaverCS5 - Phần 1AdobeDreamweaverlàmộtcôngcụxửlýmạnhmẽdànhchonhữngngườithiếtkếweb,ngườidùngcóthểtựmìnhlậptrìnhvàpháttriểnứngdụngwebởnhiềucấpđộ.NếuchỉdừngởmứcđộhiểubiếtchưanhiềuvềcácngônngữlậptrìnhwebthìDreamweavervẫnđápứngđượcnhucầuthiếtkếWebsitechuyênnghiệp.NgườidùngkhôngchuyênchỉviệccầntìmchomìnhmộtmẫutrangwebvừaýtrênInternet,dùngcôngcụsoạnthảothôngthườngđểchỉnhsửahaythêmbớtmộtsốthànhphần,rồitạoramộtTemplateđểápdụngchotoànbộWebsite.Ngoàinhữngtínhnăngkéothảđểxâydựngtrangweb,Dreamweavercòncungcấpmộtmôitrườngviếtmãvớiđầyđủchứcnăngbaogồmcáccôngcụviếtmã(nhưtômàumã,bổsungthẻtag,thanhcôngcụmã),hỗtrợcácngônngữlậptrìnhthôngdụngHTML,CSS,Javascript,ASPVBScript,PHPhayXML.NếumuốnxâydựngcácứngdụngwebđộngchạytrêncôngnghệmáychủASP.NET,ASP,JSPvàPHPthìDreamweaverhoàntoàncóthểđápứngđượccácdựánlớnnày.Giaodiệnsửdụngđượcbốtrítrựcquanvàthânthiệnvớingườisửdụng,khuvựcsoạnthảođoạnmãđượcđánhsốthứtựởcácdòngvàcótômàutheotừngthẻgiúptiệnchoviệctheodõi,kiểmtra.Ngoàigiaodiệnmặcđịnh,chươngtrìnhcònhỗtrợnhiềudạnggiaodiệnvớicáchbốtrívítríthanhcôngcụkhácnhau,tạitínhnăngDesigner(đốivớiphiênbảnDreamweaverCS5).AdobeDreamweavercóthểkếthợpcácphầnmềmkháccủahãngAdobeđểtạoramộtsảnphẩmhoànhảo,vídụnhưAdobePhotoshopgiúpchỉnhsửavàthiếtkếhìnhảnhchoWebsite.CóthểtảiAdobeDreamweaverbảndùngthử30ngàytạiđây.TạothưmụcchứabộwebTrướckhibắttayvàoviệctạoramộttrangwebthìcôngviệcđầutiêncủangườithiếtkếlàphảitạoramộtthưmụcđểchứatoànbộnhữnggìliênquanđếntrangweb,vídụwebserver.Trongthưmụcđó,bạnsẽtạotiếpcácthưmụckhácdùngđểchứadữliệunhư:ThưmụcImagedùngđểchứatoànbộhìnhảnhcủatrangweb.ThưmụcFlashdùngđểchứanhữngtậptinflash,videoclip,…ThưmụcDatadùngđểchứadữliệuVàcácthưmụckháctùytheomụcđíchcủangườitạoweb.2.TạomớimộttrangwebKhởiđộngDreamweaver,trongcửasổđầutiêncủachươngtrìnhchọnHTMLđểmởmộttrangtàiliệumới.HoặcvàomenuFile,chọnNew.TrongmụcBlankPagechọnHTMLvàbấmvàonútCreateđểkhởitạomộttrangmới(hình1). Hình1.Khởitạotrangweb3.LưumộttrangwebTrướckhibắttayvàothiếtkế,bạnnênlưutrangweblạibằngcáchvàomenuFile,chọnSavehoặcSaveas.Sauđólưutrangwebvàothưmụcchứabộwebvớidạng*.html.Lưuý,trangchủcủawebsitebắtbuộcphảiđặttênlàindex.htmlvàphảiđượclưungaytrongthưmụcchứabộweb.4.Địnhdạngtrangweb Hình2.ThuộctínhtrangwebSaukhilưulạitrangwebthànhcông,vàomenuModifychọnPagePropertiesđểcàiđặtđịnhdạngchotrangweb.TronghộpthoạiPagePropertiesbạnchỉnhcácthôngsốsau(hình2):MụcAppearance(HTML):+Backgroundimage:ChọnBrowsevàduyệtđếntậptinảnhdùnglàmnềnchotrangweb.+Background:Bấmvàonútbảngmàuvàchỉramàunềnchotrangweb.+Text:Chỉđịnhmàuchữmặcđịnh.+Link:Chỉđịnhmàuchữmặcđịnhkhibạntạoliênkếtchonó.+Leftmargin:Nhậpvàokhoảngcáchlềtráisovớinộidungtrangweb.+Topmargin:Nhậpvàokhoảngcáchlềtrênsovớinộidungtrangweb.+Marginwidth:nhậpvàođộrộngcủatrangweb.+Marginheight:nhậpvàođộcaocủatrangweb.MụcTitle/Encoding: Hình3.Tiêuđềvàbảngmã+Title:Nhậptiêuđềcủatrangweb.+Cácmụckháccứđểmặcđịnh.Saukhitinhchỉnhđịnhdạngtrangwebxong,chọnOKđểthiếtlập(hình3).5.XemtrangwebtrêntrìnhduyệtTrongquátrìnhlàmviệc,nếumuốnxemthửtrangwebtrêntrìnhduyệtthìbạnbấmCtrl+Sđểlưulại,sauđóbấmphímF12đểxemtrêntrìnhduyệtđãcàiđặtlàmmặcđịnhhoặcbấmchọnvàobiểutượngcóhìnhtráiđấtởbêntrênvàchọntrìnhduyệtcầnxem.6.TạobảngtrongtrangwebChènbảngNếumuốntạomộttrangwebcócácnộidungđượcđặtởcácvịtríphùhợpvàdễtìmratrêncácbộmáytìmkiếmthìbạncầntạoramộtbảngtrướckhinhậpnộidung.Đểthựchiện,bạnvàoMenuInsert,chọnTable. Hình4.ThiếtlậpthuộctínhbảngHộpthoạiTablehiệnra,nhậpsốdòngtrongmụcRows,sốcộttrongmụcColumns,độrộngcủaTabletrongmụcTablewidthvàtrongmụcBorderthicknessnhậpvàogiátrịđộlớncủakhungtrongbảngsauđóbấmOK(hình4).ĐịnhdạngbảngBấmchuộtvàođườngkhungcủabảng,khungthuộctínhcủabảnghiệnrabêndướinhưhình5 Hình5.ĐịnhdạngbảngThiếtlậpbảngthuộctínhgồmcácnộidungsau:W,H:Chiềurộngvàchiềucaocủabảng.Rows:Sốhàng.Cols:Sốcột.CellPad ...