传智播客张鹏ppt一周学会html课件_精品文档PPT文件格式下载.ppt
《传智播客张鹏ppt一周学会html课件_精品文档PPT文件格式下载.ppt》由会员分享，可在线阅读，更多相关《传智播客张鹏ppt一周学会html课件_精品文档PPT文件格式下载.ppt（68页珍藏版）》请在冰豆网上搜索。
用html语言创建的文档手工直接编写（例如记事本）。
通过图形化的HTML开发软件Dreamweaver。
由Web服务器上的动态网页程序生成。
HTML标记标记的语语法法html最基本的语法就是内容，标记符通常都是成对使用的，有一个开头标记和一个结束标记。
结束标记只是在开头标记的前面加一个斜杠“/”当浏览器打开html文件后，就会理解里面的标记符，然后把标记符对应的功能表达出来。
如：
例如：
文字内容高级网页设计人才培训专家高级网页设计人才培训专家!
HTML标记标记的语法语法HTML标记的类型：
单标记与双标记标记的类型：
单标记与双标记一、单标记一、单标记
（1）.单一型单一型,无属性值。
无属性值。
（2）.单一型，有属性值。
单一型，有属性值。
HTML标标记记的语法语法二、双标记二、双标记（3）.没有属性值。
没有属性值。
（4）.有属性值。
有属性值。
HTML标记标记的语法语法HTML标记语法总结标记语法总结：
1、双标记：
、双标记：
内容内容2、单标记：
单标记：
3、标记的属性：
、标记的属性：
内容内容说明：
说明：
A、标记与属性、属性之间以空格分隔、标记与属性、属性之间以空格分隔B、属性不区分先后顺序；
且属性不是必需的、属性不区分先后顺序；
且属性不是必需的重点强调：
虽然在重点强调：
虽然在HTML中标记不区别大小写，但在中标记不区别大小写，但在XHTML中所有标记都必须小写，所以中所有标记都必须小写，所以建议从现在开始，所有标记都采用小写。
建议从现在开始，所有标记都采用小写。
html文档结构1、文档结构所有的网页文件,通常由四对标记来构成,文档的骨架，它们是：
标题正文l标识网页文件的开始与结束，所有的html元素都要放在这对标记中l标识网页文件的头部信息，如标题、搜索引擎关键字等l标识网页文件的标题l标识网页文件的主体部分高级网页设计人才培训专家高级网页设计人才培训专家!
Meta标记用于定义文件信息lMeta标记用于定义文件信息，对网页文件进行说明，便于搜索引擎查找。
放置于之间l设置关键字：
l多个关键字内容之间可以用“，”分隔l设置描述：
l设置作者：
l设置字符集：
l设置页面定时跳转：
l
（1）、注释ll
（2）、body属性l网页主体标记body高级网页设计人才培训专家高级网页设计人才培训专家!
字体修饰l
（1）、标记l语法：
l文本l注：
网页中的文本字体、字号一般通过CSS修饰颜色英文名称十六位进制颜色英文名称十六位进制白色White#FFFFFF黑色Black#000000红色Red#FF0000绿色Green#00FF00蓝色Blue#0000FF灰色Gray#999999高级网页设计人才培训专家高级网页设计人才培训专家!
（2）、字符格式功能标记加粗文本倾斜文本加强语气（加粗）文本加强语气（倾斜）文本下划线文本删除线文本上标文本下标文本高级网页设计人才培训专家高级网页设计人才培训专家!
l（3）、段落标记：
l格式：
l属性名称属性值说明lalignleft左对齐（默认）center居中right右对齐段落控制标记高级网页设计人才培训专家高级网页设计人才培训专家!
l（4）、段落标题l：
段落标题说明：
X取值16hx内的文本会自动加粗显示。
hx针对的对象是段落，而font针对的对象的任意文本。
l（5）、：
换行（换行不换段）段落控制标记高级网页设计人才培训专家高级网页设计人才培训专家!
修饰标记l（6）.水平直线l属性名称属性值说明size像素绝对设置，以数字表示，属性值越大，线越粗百分比相对设置，以%表示，属性值越大，线越粗width像素绝对设置，长度不会应视窗的改变而改变百分比相对设置，长度会随着视窗宽度而改变noshade=noshade实体线高级网页设计人才培训专家高级网页设计人才培训专家!
特殊标记l定义一个块引用：
使用文本缩进格式：
.属性名称属性值说明citeurl被引用的地址l居中标记内容内容（被废弃的标签被废弃的标签）l预格式化l显示已经格式化好的文字。
不加此标记的话，HTML浏览器会忽略所有空格和制表符。
在在HTML文档中使用特殊字符文档中使用特殊字符特殊字符转义码空格&
nbsp;
版权号&
copy;
注册商标&
reg;
“&
quot;
&
amp;
gt;
网页中信息的排序显示-如何实现高级网页设计人才培训专家高级网页设计人才培训专家!
列表的标记1、列表标记用途：
列表标记可以创建一般的无序列表、编号列表，以及定义列表三种方式。
还可以在一种列表中嵌套另一种列表。
便于概括显示一系列相关的内容。
1、无序列表2、有序列表3、定义列表高级网页设计人才培训专家高级网页设计人才培训专家!
2、无序列表l语法：
l内容1内容2ll表示一个项目参数值（必须小写字母）描述disccirclesquare列表的标记高级网页设计人才培训专家高级网页设计人才培训专家!
3、有序列表语法：
内容1内容2属性名称属性值说明type1表示以1,2,3,4来表示a表示以a,b,c,d来表示A表示以A,B,C,D来表示i表示以i,ii,iii来表示I表示以I,II,III来表示列表的标记高级网页设计人才培训专家高级网页设计人才培训专家!
4、定义列表l语法：
l标题1内容1内容2标题1内容1内容2l定义列表l表示一个项目l表示一个项目下的更详细的内容的解释定义列表高级网页设计人才培训专家高级网页设计人才培训专家!
lWeb上支持的图片格式GIF（图形交换格式）：
GIF格式文件最多只能保存256种颜色。
该格式支持透明色，支持动画效果。
JPEG（联合图像专家组）：
该格式不支持透明色及动画，颜色可达1670万种PNG（网络可移植格式）：
该格式支持透明色，但不支持动画，颜色从几种至1670万种。
l图片标记l图片高级网页设计人才培训专家高级网页设计人才培训专家!
路径l绝对路径：
提供目标文档的完整主机名称、路径信息、及文档全称l相对路径:
从当前文档开始的路径l如果当前文档和目标文档位置平行，则直接书写目标文档全称l如果当前文档和目标文档所在文件夹位置平行，则书写为文件夹名称/目标文档全称l如果当前文档所在文件夹和目标文档位置平行，则书写为./目标文档全称l根相对路径:
从站点根目录开始的路径，以/开头高级网页设计人才培训专家高级网页设计人才培训专家!
属性名称属性值说明srcURL图片的路径alt文本规定图片的替代文本图片无法显示时title文本鼠标悬停时显示的内容width像素/百分比设置图片宽height像素/百分比设置图片高border数字设置图象边框alignleft图片靠左,文字靠右right图片靠右,文字靠左top文字垂直居上靠middle文字垂直居中bottom文字垂直居下（默认）vspace像素定义图像顶部和底部的空白（垂直边距）hspace像素定义图像左侧和右侧的空白（水平边距）高级网页设计人才培训专家高级网页设计人才培训专家!
轻松学习HTML第二课表格与链接表格与链接主讲：
目标目标1.1.表格的表格的应用用2.超级链接的使用超级链接的使用31高级网页设计人才培训专家高级网页设计人才培训专家!
网页中内容排版与定位-表格32高级网页设计人才培训专家高级网页设计人才培训专家!
表格l因为表格中可以包含任何内容，所以在使用DIV+CSS之前，网页设计师是使用表格对网页内容进行排版与布局的l表格基本结构：
.-定义表格.-定义表行.-定义表列（单元格）.-定义标题栏（文字加粗）高级网页设计人才培训专家高级网页设计人才培训专家!
属性用途设置表格的背景色。
设置表格的背景图片。
设置边框的宽度，若不设置此属性，则边框宽度默认为0。
设置表格单元格边框与其内部内容之间空间的大小。
默认为2（表格边距）设置表格单元格之间空间的大小。
默认为2（单元格间距）设置表格边框的颜色。
设置边框亮部分的颜色（当border的值大于等于1时才有用）。
设置边框暗部分的颜色（当border的值大于等于1时才有用）。
设置表格的对齐方式（left=左，center=居中，right=右）设置表格的宽度，单位用绝对像素值或总宽度的百分比。
表格的属性：
标签下的边框设置标签下的边框设置属性名称属性值说明framevoid不要显现表格的边线above只要显现出表格的上边线below只显现出表格的下边线hsides只显示表格的上下边线vsides只显现表格的左右边线lhs只显现表格的左边线rhs只显现表格的右边线border/box会显现出表格的所有边线rulesrows只显示出横行的格框线cols只显示出直行的格框线all显示全部格框线groups表示列组合水平部分none不显示任何格框线该属性必须在border的属性值不为0的状态下!
35高级网页设计人才培训专家高级网页设计人才培训专家!
属性用途设置行的宽度设置行的高度设置行的背景颜色设置行的背景图片设置水平对齐方式设置垂直对齐方式top、middle、bottom行的属性：
属性用途设置单元格的宽度设置单元格的高度设置单元格的背景颜色设置单元格的背景图片设置单元格的水平对齐方式设置单元格的垂直对齐方式设置行合并的数目设置列合并的数目设置在单元格中不换行列（单元格）的属性：
l表格的结构化l
（1）.结构化格式：
ll-表头区l-表体区ll-表尾区l高级网页设计人才培训专家高级网页设计人才培训专家!
l
（2）.直列化格式：
l.l属性名称属性值说明lalignleft靠左center靠中right靠右lvaligntop靠上middle靠中bottom靠下lspan数字直列数lbgcolor颜色背景颜色l个别直列设置l格式:
功能完全和一样高级网页设计人才培训专家高级网页设计人才培训专家!
l（3）.表格的标题：
l.ll下的属性值有:
l属性名称属性值说明laligntop标题在表格上方bottom标题在表格下方高级网页设计人才培训专家高级网页设计人才培训专家!
超链接：
HyperLink一个网站是由多个网页组成的，网页之间都是
升级会员 