<!---->
表格结构化<table><thead>...</thead> 表头区<tbody>...</tbody> 表体区...............<tfoot>...</tfoot> 表尾区</table> 表格的标题<table> <caption>...</caption></table><caption>下的属性值有属性名称 属性值 说明align top 标题在表格上方 bottom 标题在表格下方 网页优化(经验)优化代码 代码越少 网页打开速度越快-----尽量减少标记的嵌套 表格的直列化格式<colgroup>...</colgroup> 对td操作属性名称 属性值 说明align left 靠左 center 靠中 right 靠右valign top 靠上 middle 靠中 bottom 靠下span 数字 直列数 (是控制多少列而不是第几列)bgcolor 颜色 背景颜色个别设置 个别直列化格式:<col>功能完全和<colgroup>一样具体操作:复制两行一样的col 然后再第一行用span进行控制
图片标记两边不能有空白。否则会把图像嵌入在空白的文字当中的形式。
FSC工具:屏幕标尺
<table>标签下的边框设置属性 属性值 说明frame void 不要显现表格的边线 above只要显现出表格的上边线 below只显现出表格的下边线 hsides只显示表格的上下边线 vsiedes只显现表格的左右边线 lhs只显现表格的左边线 rhs只显现表格的右边线 border/box会显现出表格的所有边线注释:该属性必须在border的属性值不为0的状态下!rules rows只显示出横行的格框线 cols只显示出直行的格框线 all显示全部格框线 groups表示列组合水平部分 none不显示任何格框线
html最基本的语法就是<标记符>内容</标记符>.1、单标记 br,hr可以有无属性值;在源代码里看到的东西往往和在浏览器上看到的东西是不一样的。<br>换行2、双标记在xhtml中所有的标记都必须小写;<html>标志网页文件的开始 <head>网页文件的头部信息; <title>网页文件的标题 </title> </head> <body>标志网页文件的主体部分 <body></html>
列(单元格)属性<td><td width="">宽度<td height="">高度<td bgcolor="">背景色<td background="">背景图片<td align="">水平对齐方式<td valign="">垂直对齐方式<td rowspan="">行合并的数目<td colspan="">列合并的数目<td nowarp="nowrap">在单元格中不换行单元的合并操作公式:列合并 如果合并3列则需要删除2个单元格删除的个数等于合并个数-1同理行合并
表格与链接网页中内容排版与定位--表格基本结构<table>...</table>定义表格<tr>...</tr>定义表行<td>...</td>定义表列(单元格)<th>...</th>定义标题栏(文字加粗)表格的属性<table bgcolor="">表格背景色<table background="">表格背景图片<table border="">边框宽度 默认为零<table cellpadding="">设置表格单元格边框与其内容之间空间的大小,默认值为2(表格边距)<table cellspacing="">设置表格单元格之间空间的大小,默认为2(单元格间距)<table bordercolor="">设置表格边框颜色<table bordercolorlight="">设置边框两部分的颜色(当border的值大于等于1时才有用)<table bordercolordark="">设置边框暗部分的颜色(当border的值大于等于1时才有用)<table align="">设置表格的对齐方式(left左 center居中 right右)<table width="">设置表格的宽度,单位用绝对像素值活总宽度的百分比
网页制作流程1、新建一个站点文件夹(用于保存网站中所有的内容)2、再将网站的素材分类保存到子文件中(例如图片保存到image文件中)图片属性属性 属性值 说明src url 图片的路径alt 文本 规定图片的替代文本(图片无法显示时)title 文本 鼠标悬停时显示的内容width 像素/百分比 设置图片宽height 像素/百分比 设置图片高border 数字 设置图像边框align left 图片靠左,文字靠右 right 图片靠右,文字靠左 top 文字垂直居上靠 middle 文字垂直居中 bottom 文字垂直居下(默认值)vspace 像素 顶堤图像顶部和底部的空白(垂直边距)hspace 像素 定义图像左侧和右侧的空白(水平边距)
1、html语言的作用:用来控制网页的内容,将内容分结构来显示gbk简体中文 适合大陆 utf-8国标码2、html标记的用法,嵌套使用 一层套一层 不可交叉使用3、浏览器有容错性 但制作的网页还是要符合标准图片标记<img src="图片 的路径"/>路径绝对路径:提供目标文件的完整主机名称、路径信息及文档全称相对路径:从当前文档开始的路径如果当前文档和目标文件位置平行,则直接书写目标文档全称如果当前文档和目标文档锁在文件夹位置平行,则书写为文件夹名称/目标文档全称如果当前文档所在文件夹和目标文档位置平行,则书写为../ 目标文档全称 (../表示向上走一级)根相对路径:从站点根目录开始的路径,以"/"开头
列表标记列表标记可以创建一般的无序列表、编号列表以及定义列表三种方式,还可以在一种列表中嵌套另一种列表,便于概括显示一系列相关的内容无序列表<ul>...</ul>语法<ul type="项目符号类型"> <li type="项目符号类型">内容1</li> <li>内容2</li> ... </ul>注:<li></li>表示一个项目有序列表<ol>...</ol>语法:<ol start="列表起点" type="项目符号类型"> <li>内容1</li> <li>内容2</li> ...</ol>定义列表<dl>...</dl>语法:<dl> <dt>标题1</dt>表示一个项目 <dd>内容1</dd> <dd>内容2</dd>表示一个项目下的更详细的内容解释 .... </dl> 重点复习1、理解什么是html标记用于描述网页内容的标记性语言(对网页内容进行结构化处理)将内容放置于适合的标记内,比如,文字就在<p> ,标题性文字就在<hx>2、标记的语法单标记<标记 属性="属性值"> 注意属性的默认值3、常用的标记 p br h1--h6 font al ol dl