一、安拆dreamweaver
一、成立站点文件夹
在电脑硬盘上e:新建一个文件夹做为网站的根目次,里面包罗四个文件夹 ,别离为images(放图片),flash(放flash),css(款式表),js(javascript)。
翻开dreamweaver,设置站点
站点—新建站点—抉择高级
点 确定,如许站点就成立好了
四、新建HTML文档,保留首页为index.htm
五、HTML根底常识
1、文档类型
当我们用dreamweaver新建一下html格局文档时,查看源代码,会发现代码最上部有如下那句话:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
那句话标明本文档是过渡类型,别的还有框架和严厉类型,目前一般都摘用过渡类型,因为阅读器对XHTML的解析比力宽松,容许利用HTML4.01中的标签,但必需契合XHTML的语法。许多伴侣在造造页面时,往往喜好把那句删除掉,在那里定见各人必然要保留那句话,删除它后可能引起某些款式表失效或其它意想不到的问题。
2、语言编码
接下来我们还会发现如许一句话:
meta " /
它标示文档的语言编码。就像我们日常平凡所说的汉语、英语一样。那里的gb2312告诉阅读器,本文档摘用简体中文编码;还有一种常用的编码是UTF-8编码,它是国际通用的编码。不管我们摘用哪种编码,有一点就是包罗的css款式表和其它文件也必需和本文档的编码一样,要不就会呈现乱码。
3、html标签
html标签在页面中都必需完毕。成对的标签以“/标签名”完毕,有些单一的标签在自己的结尾打上/来完毕,那是xhtml代码编写的标准
成对的标签:
head{...}/head
body{...}/body
div{...}/div
span{...}/span
p{...}/p
单一的标签:
img src="" /
br /
3.1 分段 p…… /p
p黄石文化宫/p
p起源培训学校 /p
3.2 换行 br /
黄石文化宫起br /
源培训学校
3.3 题目
题目1:h1黄石文化宫起源培训学校/h1
题目2:h2黄石文化宫起源培训学校/h2
题目3:h3黄石文化宫起源培训学校/h3
题目4:h4黄石文化宫起源培训学校/h4
题目5:h5黄石文化宫起源培训学校/h5
题目6:h6黄石文化宫起源培训学校/h6
3.4 span标签
html xmlns=""
head
meta " /
title无题目文档/title
style type="text/css"
.STYLE1 {
font-family: Verdana, Arial, Helvetica, sans-serif; //字体
font-size: 14px; //字体大小
color: #FF0000; //字体颜色
font-weight: bold; //字体加粗
font-style: italic; //字体倾斜
/style
/head
body
divspan黄石文化宫起源培训学校/span // align 字体对齐(left center right)
/div
/body
/html
3.5 DIV标签
div align="left"span黄石文化宫起源培训学校/span/div
3.6 项目列表 UL和LI
div
ul
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
/ul
/div
3.7 编号列表 OL 和 LI
div
ol
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
lispan黄石文化宫起源培训学校/span/li
/ol
/div
3.8 链接
a href="
链接a …… /a
Herf=“链接的网址”
Target="_blank” 那里能够是blank 新翻开一个空白页
Target="_parent” 那里能够是parent 间接在当前页面翻开
3.9 图片 img src="images/11.gif" width="242" height="250" /
diva href="#"img src="images/11.gif" alt="黄石平面设想培训" width="242" height="250" border="0" //a/div
3.10 表格
table width="600" border="0" cellpadding="0" cellspacing="0" bordercolor="#FF0000" background="images/11.gif" bgcolor="#FFFF00"
tr
tdnbsp;/td
tdnbsp;/td
tdnbsp;/td
/tr
tr
tdnbsp;/td
tdnbsp;/td
tdnbsp;/td
/tr
tr
tdnbsp;/td
tdnbsp;/td
tdnbsp;/td
/tr
/table
3.11 单位格
td width="200" height="40" valign="middle" bordercolor="#3399FF" background="images/11.gif" bgcolor="#FF6600"黄石起源培训 /td
六、CSS内部款式
那里要晓得什么是内容,什么是填充 什么是边框 什么是鸿沟
div id="header"此处展现 id "header" 的内容/div
#header {
height: 300px;
width: 400px;
padding: 20px; //填充
border: 5px solid #FF0000; //边框宽度为5,solid是实线,#FF0000边框的颜色
margin: 20px; //鸿沟