讲义重新整理1 -- HTML基本上知识与DW单纯采用
讲义重新整理1 -- HTML基本上知识与DW单纯采用
概念应用程序和服务端配置文档、基本上名、file天然资源文档和公交站点甚么是HTML有关W3CW3C的规范化网页的制做网页的基本上架构透过书签写网页Dreamweaver 设计器概要中文网站与网页基本上概念相片有关相片的基本上概念图形CorelDRAW导出度常见的相片文件格式JPG/JPEGGIFPNG文件格式切换相片的强化切碎ps和fw常见功能键Dreamweaver的采用填入相片填入文本填入源文件填入表单分拆常量和分拆常量条码选择概念
学习html首先介绍应用程序和服务端,配置文档和file,同时介绍关上网页的继续执行操作过程、公交站点、甚么是HTML。
应用程序和服务端
应用程序:其他用户采用的计算机系统。
注意:图书馆员其实也是其他用户,所以图书馆员采用的也是应用程序(在伺服器上直接操作仅限)。服务端:置放网页文档的计算机系统。
关上网页的继续执行操作过程:
配置文档、基本上名、file
配置文档:由基本上名和file组成。
比如说:demo.txt 其中demo是基本上名,txt是file。file:用于界定文档类型。
网页的file主要包括:动态网页的file:html、htm(其他习题:asp、aspx、php、jsp)天然资源文档和公交站点
两个中文网站中主要包括HTML网页,css,JS,相片,flash动画电影或gif动画电影等,那些都属于天然资源文档。
为的是方便管理,我么将那些那些动态天然资源置放在两个配置文档下。这个配置文档称为公交站点。
做中文网站的第二步要难度很大公交站点。甚么是HTML
HTML(HyperText Mark-up Language LZ77记号词汇)
HTML词汇的准则:
命令都要放在<>绝大部分记号都是成对再次出现条码绝大部分都是<tag>开始</tag>结束HTML词汇不界定UTF有关W3C
W3C world wide web consortium 因特网联合会
W3C的规范化
W3C的规范化有很多,重要的规范化如下表所示:
两个网页只能有两个根原素记号要成对再次出现(不容许空记号)空记号有时带斜线是为的是遵从W3C表述的规范化 比如说:<br />网页的制做
网页的基本上架构
两个网页要具备如下表所示架构:
透过书签写网页
关键步骤:
在公交站点配置文档新建两个txt文档,在文档中输入如下表所示标识符<html> <head> <title> 欢迎进入html世界 </title> </head> <body> 这是我的第两个网页 </body> </html> 1 2 3 4 5 6 7 8 9 10 更改文档file为html或htm,保存并双击网页,透过应用程序关上,关上时可能再次出现乱码。Dreamweaver 设计器概要
Dreamweaver简称dw,是前端开发中两个非常强大的工具。(文章的最后有一些具体采用)
作用:
1、具备很多提示
参数设置:编辑–参数(功能键:Ctrl+U)更改自动补全的继续执行时间:参数设置–标识符提示–结束条码2、管理公交站点配置文档
Dreamweaver 和配置文档建立关联:公交站点–新建公交站点–设置公交站点名称和本地配置文档路径—注意:删除dw公交站点,公交站点配置文档并不会删除源配置文档。中文网站与网页
基本上概念
中文网站:所有网页的集合
首页(主页):当输入网址后关上的网页,名称一般为index或default
如果两个中文网站中没有首页,则这个中文网站将无法显示。子网页:除了首页以外的网页。
子页命名准则:小写的英文本母或数字,不能是中文。(相片也不能用中文)
网页尺寸:以不再次出现水平滚动条为准,目前的网页宽度以17寸屏(1024*768)为准。
相片
有关相片的基本上概念
图形
图形像素:由屏幕上的像素点来描述图像。
放大失真,会再次出现马赛克模糊。图形颜色较为丰富。操作图形的软件:PS 和 FW
CorelDRAW
CorelDRAW形:采用线和面组成图形,所以称为矢量。
放大不失真,体积小。颜色数没有图形丰富。操作图形的软件:ai,FW
注意:CorelDRAW不能直接放在网页上,要经过图像处理软件切换成网页支持的相片文件格式(jpg、gif、png)。导出度
导出度:在单位长度上的像素数,用来衡量图形质量好坏的指标,导出度越大,相片质量越好。通常以“像素/英寸”,网上一般72(像素/英寸)。
中文网站默认尺寸单位为像素。常见的相片文件格式
JPG/JPEG
有损压缩,颜色数达到一千六百多万种,是目前采用量很大的一种相片文件格式。
不支持透明,不支持动画电影。GIF
颜色数很少,只有256种。
支持透明,支持透明,相片质量很差,现在已经用的很少。二者比较:
gif颜色数目少,最多256种,一般用于图标、标识;jpg颜色细腻丰富,支持颜色多达1600多万种。用于质量要求较高的图像,如人物照片、风景等gif体积小,jpg体积大gif支持透明,jpg没有透明色gif支持动画电影,jpg不支持PNG
无损压缩,体积小,质量好。
支持文件格式透明,此文件格式越来越被广泛应用。在项目中用jpg和png文件格式相片。文件格式切换
关上源图–文档–另存为–选择文件格式–保存
相片的强化
采用工具ps和fw
改大小(尺寸):修改–画布–大小 或者 直接点击属性面板中的“图像大小”按钮–更改像素尺寸降导出度:直接点击属性面板中的“图像大小”按钮–取消图像重新取样选项–更改导出度降质量(压缩):文档–图像预览–降低品质(品质降低应适当,否则会失真)做切碎:详细如下表所示切碎
做切碎:拿到两个效果图后,将有用的部分给切下来。
注意:拿到效果图的时候,先看效果图的尺寸,将效果图的尺寸调整到主流应用程序再做切碎。关键步骤:
选择web-切碎工具文档–导出,类型选择“仅图像”,切碎选择“导出切碎”,取消主要包括无切碎区域切碎后一般要拿到Dreamweaver中拼版拼版:用table记号拼版,具体在表单拼版中介绍小技巧:为的是切碎准确,可以跳出标尺,透过保持拉出辅助线,FW中,显示/隐藏标尺功能键是ctrl+alt+Rps和fw常见功能键
ctrl+加号:相片放大ctrl+减号:相片缩小ctrl+减号:相片缩小双击手型工具:将相片自适应大小显示双击 手型 工具:将相片自适应大小显示Tab键全部显示/隐藏工具面版(在fw和dw中,F4也可以显示/隐藏工具面版)按住空格键快速切换到手型工具ctrl键快速切换到选择工具Dreamweaver的采用
填入相片
方法一:点击填入相片按钮
方法二:直接将公交站点中的相片拖放在相应位置
填入文本
注意事项:1.输入空格:切换到全角,再输入空格2.回车:换段3.shift+回车:换行填入源文件
方法一:选择文本或相片,在属性面板上选择链接的地址
方法二:用指向文档工具连接到指定文档处
链接文档在新的应用程序中关上,在目标选项中选择_blank
填入表单
表单的单位:1.像素:绝对单位2.百分比:相对单位最外层表单单位是像素,套用的可以是像素也可以是百分比。边框:一般调成0常量填充:内容距边的距离(默认=1px)一般设置为0常量间距:常量与常量的距离(默认=2px)一般设置为0分拆常量和分拆常量
选中常量,在属性面板上会再次出现分拆常量和分拆常量按钮
条码选择
条码选择用来快速选择HTML对象。
请立即点击咨询我们或拨打咨询热线: ,我们会详细为你一一解答你心中的疑难。项目经理在线