网页制作代码模板免费版（做一个网页代码模板）

大家好，我是讯享网，很高兴认识大家。
                    <p>Adobe DreamweaverCS6课程笔记</p><p>第一节、Dreamweaver CS6软件简介和安装</p><p>一、DreamweaverCS6是由美国Adobe公司最新开发的一款网页设计、网站管理为一体的专业软件。</p><p>二、为了保让能够正常安装，在安装时，请断开网络。</p><p>第二节、DWCS6软件界面的简介</p><p>一、软件界面组成</p><p>1、菜单栏</p><p>2、工作区</p><p>3、属性栏</p><p>4、浮动面板（文件、资源、CSS样式、行为等）</p><p>二、界面的切换：为满足不同人群的需求。</p><p>三、界面的恢复：窗口——工作区——重置设计器</p><p>四、插入面板的调用。</p><p>第三节、网页相关知识</p><p>一、DreamweaverCS6是由美国Adobe公司最新开发的一款网页设计、网站管理为一体的专业软件。</p><p>二、什么是网页（网页的概念）：在互联网上基于http协议传播信息的页面。</p><p>三、什么是网站：反应同一主题的多个网页的集合。</p><p>四、网页内容的组成(网页元素)</p><p>1、文字</p><p>2、图片（jpg，gif，png）</p><p>3、动画（swf，gif）</p><p>4、多媒体</p><p>5、超链接</p><p>6、表单</p><p>7、网页特效</p><p>8、其它元素</p><p>第四节、网页制作方法与站点建立</p><p>一、网页的制作方法</p><p>1、代码法：html</p><p>2、软件制作：Dreamweaver、frontpage（所见即所得）。</p><p>二、制作网站前准备工作：建立站点。</p><p>三、站点：用来存放网站中所有元素的文件夹，为了制作方便需要将这个文件夹和制作软件相链接。</p><p>四、站点的建立(链接)</p><p>1、站点——建立</p><p>2、文件面板</p><p>3、应用程序栏（窗口——应用程序栏）</p><p>五、站点的分类（按照网站的位置）</p><p>1、本地站点</p><p>2、远程站点</p><p>第五节、规划本地站点目录结构</p><p>一、规划本地站点目录结构</p><p>1、images（图片）</p><p>2、swf（动画）</p><p>3、css（CSS样式）</p><p>4、script（存放网页特效）JS</p><p>5、other（其它）</p><p>二、网站主页名称</p><p>1、index.htm</p><p>2、index.html</p><p>3、default.htm</p><p>4、default.html</p><p>注：主页必须放在网站的根目录下面，同时名称也有特殊的要求。</p><p>第六、七节、网页中文字的输入1-2</p><p>一、网页的四个视图</p><p>1、设计视图</p><p>2、代码视图</p><p>3、拆分视图</p><p>4、实时视图</p><p>二、网页中的文字</p><p>1、文字直接输入就可以了。</p><p>2、回车表示换段。</p><p>3、shift+回车：表示换行。</p><p>4、输入空格时要在全角输入法状态下输入。</p><p>5、特殊字符的插入：“插入——html——特殊字符”</p><p>6、文字也可以从网站中复制，但是在复制时需要将网页中文字的格式去掉。</p><p>（注：如何去除复制来的文字格式，只需要将文字粘贴到记事本中，然后从记事本中再复制文字就可以了。）</p><p>三、预览网页：文件——在浏览器中预览——IExplore（快捷键：F12）</p><p>第八、九节、页面属性1-2</p><p>一、页面属性</p><p>1、修改——页面属性</p><p>2、或通过属性栏</p><p>二、属性</p><p>1、左边距、右边距、上边距、下边距。</p><p>2、文字字体、大小、颜色。</p><p>（注：A、字体：选择常用字体。如：宋体</p><p>B、大小：正文文字一般设置为12-16px。）</p><p>3、页面背景。</p><p>4、背景图片。（默认情况自动填充、平铺）</p><p>（注：A、图片要放在站点内。（有关网站中的所有元素都必须放在站点内）。</p><p>B、图片名称不能为中文。）</p><p>（注：如果同时设置背景颜色和背景图片，以背景图片为准。）</p><p>第十节、Html网页基本代码格式</p><p>一、网页基本代码</p><p><html></p><p><head></p><p><title></title></p><p></head></p><p><body></p><p></body></p><p></html></p><p>（注：1、head：开头部分</p><p>2、title：标题</p><p>3、body：正文部分）</p><p>二、常用代码</p><p>1、<p></p>：换段</p><p>2、<br>：换行</p><p>注：多数html代码都有对称性的特点。</p><p>第十一节、图片的插入</p><p>一、图片</p><p>1、图片格式</p><p>（1）JPG：图片质量较高，一般用于较大的图片。如：人物、风景。（不支持透明）（2）gif：用于制用按钮、动画、导航条等，图片较小，只有256种颜色。（支持透明）（3）png：兼有两种格式的特点。（支持透明）注：图片的大小一般尽量控制在200K以下。</p><p>2、链接</p><p>（1）_blank：在新的网页打工。</p><p>（2）_self：在自身网页打开。</p><p>第十二节、图片热点</p><p>一、热点</p><p>1、矩形热点</p><p>2、圆形热点</p><p>3、多边形热点</p><p>注：编辑——首选参数——辅助功能——图像</p><p>二、替换</p><p>1、用于图片的注释。</p><p>2、当图片无法显示的时候用此内容代替。</p><p>三、宽度和高度的设置</p><p>四、相关html代码</p><p>1、Img：图片。</p><p>2、Src：位置。</p><p>3、热点：<map>……</map></p><p>第十三节、图片的编辑</p><p>一、裁剪、亮度对比度、锐化</p><p>注：使用Dreamweaver编辑图像是个不好的习惯，如果要编辑图像，最好使用专门的图像编辑软件（如：Fireworks、photoshop），编辑好了以后，再重新插入进来。</p><p>二、插入——图像对象——鼠标经过图像</p><p>三、水平线的插入</p><p>插入——html——水平线</p><p>四、背景颜色的代码：bgcolor</p><p>第十四节、超链接</p><p>一、超链接指的是通过点击一个对象可以链接打开另外一个对象（网页、图片、程序等）。</p><p>二、链接的代码（即链接的标签）</p><p>内容</p><p>文字</p><p>三、超链接的状态（修改——页面属性——链接）</p><p>1、链接：链接默认颜色。</p><p>2、变换图像：鼠标移上去时的颜色。</p><p>3、已访问：访问以后链接的颜色。</p><p>4、活动：鼠标点下去时的颜色。</p><p>第十五节、超链接打开方式</p><p>一、链接页面打开的目标：</p><p>_blank：新窗口打开网页</p><p>New：新窗口打开网页</p><p>_parent：父窗口（框架结构）</p><p>_self：自身窗口、原窗口</p><p>_top：顶窗口（框架结构）</p><p>第十六、十七、十八、十九节、超链接对象</p><p>一、超链接的对象</p><p>1、文字</p><p>2、图片</p><p>3、热点</p><p>4、空链接（#）</p><p>5、邮件链接：mailto：邮箱地址（可以利用菜单命令直接插入）</p><p>6、下载链接（浏览器打不开的内容即为下载链接）</p><p>7、锚点链接（链接到网页的具体位置）</p><p>步骤：（1）创建锚点（2）制作链接（#锚记）</p><p>隐藏锚点：编辑——首选参数——不可见元素</p>
讯享网
网页制作代码模板免费版（做一个网页代码模板）

相关推荐
