您好,欢迎访问三七文档
计算机应用信息中心张未未北京中医药大学信息中心关于我北京中医药大学信息中心信息中心:张未未邮箱:zwwatl@126.com办公室电话:64287452课程概述【网页制作】【OFFICE办公软件高级应用】北京中医药大学信息中心【Word排版技术】【PowerPoint动画制作】【Excel数据分析与处理】参考教材《网页制作》,李书珍,中国中医药出版社北京中医药大学信息中心《网页设计标准教程》,刘贵国,北京科海电子出版社网页制作基础语言——HTML北京中医药大学信息中心概述北京中医药大学信息中心HTML的基础知识文字格式和页面格式标记列表标记图像标记超链接标记表格标记框架标记表单标记什么是HTML和网页文件北京中医药大学信息中心【如何新建HTML文档】HTML文档属于纯文本文件,可以使用任意的文本编辑器书写,如记事本、写字板、Word等。这里,我们推荐使用记事本编辑HTML源文件,保存类型为“所有文件”,文件扩展名用“htm”或“html”。什么是HTML和网页文件北京中医药大学信息中心【HTML的组成】marqueebehavior=“alternate”fontface=‘隶书’size=30color=‘red’我的第一个网页!/font/marqueebr滚动的子目HTML标记•HTML是英文HyperTextMarkupLanguage(超文本标记语言)的缩写。HTML文件(.htm或.html)•以“标记名”表示标记的开始,以“/标记名”表示标记的结束。•成对标记又称之为容器,一对标记中还可以嵌套其它的标记。•单独标记不需要与之配对的结束标记,又称之为空标记。•属性设置的一般格式为:属性名=属性值,属性值部分可以用英文的双引号或单引号引起来,也可以不使用任何引号。HTML标记属性HTML标记属性值HTML的基本结构北京中医药大学信息中心【HTML的基本结构】HTML文件以html开头,以/html结束,分为头部和主体两部分。头部以head开始,以/head结束,主要用来说明与文件相关的一些信息,如该文档的网页标题、作者、关键字、所用字符集等。主体以body开始,以/body结束,主要定义要在浏览器中显示的网页内容。html---------------------------------------------------HTML文件的开始head--------------------------------------头部开始title我的第一个网页/title/head-------------------------------------头部结束body--------------------------------------主体开始在浏览器中显示的网页内容/body--------------------------------------主体结束/html---------------------------------------------------HTML文件的结束HTML的基本结构北京中医药大学信息中心【HTML的基本结构】HTML文件以html开头,以/html结束,分为头部和主体两部分。头部以head开始,以/head结束,主要用来说明与文件相关的一些信息,如该文档的网页标题、作者、关键字、所用字符集等。主体以body开始,以/body结束,主要定义要在浏览器中显示的网页内容。网页标题title…/title显示在浏览器窗口的标题栏中。标题应正确概括网页的内容。示意图HTML标记分类北京中医药大学信息中心文字格式和页面格式标记列表标记图像标记超链接标记表格标记框架标记表单标记HTML的全局架构标记北京中医药大学信息中心•html/html•head/head•title/title•body/bodyhtmlheadtitle全局架构标记/title/headbodybgcolor=“red”text=“blue”红色背景,蓝色文本/body/htmlHTML的全局架构标记北京中医药大学信息中心【body标签】HTML的文字格式和页面格式北京中医药大学信息中心【标题文字标记h#…/h#】在网页中,大大小小的标题文字是网页内容的精要概括,应该以醒目的方式显示,所以各级标题格式都是加粗样式,而且字号一般都比对应的正文内容大。h1align=center最大的标题/h1“#”用来指定标题文字的大小,可取1~6的整数,h1文字最大,h6文字最小。属性align,属性值有:left、center、right,按顺序分别为左对齐、居中对齐和右对齐。默认为左对齐。标题标记描述的中文字会以宋体和加粗格式显示,并在标题的上下各有一行间距。HTML的文字格式和页面格式北京中医药大学信息中心【强制换行和不换行标记br、nobr…/nobr】br:强制换行,放在一行的末尾,使后面的内容将另起一行显示,而又不会在行与行之间留下空行。nobr文字/nobr:不换行标记的作用是使文字不能因为太长导致浏览器无法显示而换行,它对数学公式、一行数字等尤其有用。 :符号插入一个空格。“ ”为非换行的空格符号,用它可以在文本中插入任意多个空格。HTML的文字格式和页面格式北京中医药大学信息中心【段落标记p…/p】p…/p:代表新的一段的开始、前一段的结束。段落标记会使段落的前后各有一行间距。其格式为:p这是一个段落/pp这是一个新的段落/p属性align:left、center、right,按顺序分别为左对齐、居中对齐和右对齐。默认为左对齐。HTML的文字格式和页面格式北京中医药大学信息中心【预排格式标记pre…/pre】预排格式标记之间的内容在浏览器中显示时,会按HTML源文件中的格式显示。pre具体内容/preHTML的文字格式和页面格式北京中医药大学信息中心【水平线标记hr】在网页中可以使用水平线来分隔网页的不同部分,使页面更加整洁美观。插入水平线的样式由该标记的参数决定。水平线标记的格式如下:hralign=centersize=12width=50%color=bluenoshadesize是线条的粗细,其值为像素值。width是线条的宽度,可用像素值或相对于浏览器宽度的百分比表示。color是线条颜色,默认为黑色,颜色可以用相应的英文单词或以“#”号引导的一个十六进制数来表示。noshade用于设定线条为平面显示(没有三维效果),默认效果为有阴影和立体的效果。HTML的文字格式和页面格式北京中医药大学信息中心【字体标记】fontface=“字体名称”color=“颜色名称”size=字体大小文字内容/fontSize属性取值:-7~+7HTML的列表北京中医药大学信息中心【有序列列表】列表分为有序列表和无序列表。带序号标志(如数字或字母等)的表项组成有序列表,否则为无序列表。有序列表标记olli…/ololtype=序号类型litype=序号类型1第一项litype=序号类型2第二项litype=序号类型3第三项…/ololtype=1序号为数字oltype=A序号为大写英文字母oltype=a序号为小写英文字母oltype=Ⅰ序号为大写罗马字母oltype=i序号为小写罗马字母HTML的列表北京中医药大学信息中心【无序列表】无序列表标记ulli…/ulultype=符号类型litype=符号类型1第一列表项litype=符号类型2第二列表项litype=符号类型3第三列表项…/ulultype=bullet符号为“●”ultype=circle符号为“○”ultype=square符号为“■”有序列表和无序列表不仅可自身嵌套,而且可以相互嵌套.HTML的滚动文字标记北京中医药大学信息中心【marquee】marquee/marquee说明:Direction:移动方向可选值为向上(up)向下(down)向左(left)向右(right)Behavior:移动方式,scroll一圈一圈绕着走,slide只走一次,alternate来回走Width:移动宽度Height:移动高度Scrolldelay:移动速度Scrollamount:移动位移HTML的文字格式和页面格式北京中医药大学信息中心【注释标记!--…--】HTML文档提供了注释功能。浏览器会忽略此标记中的文字而不作显示。注释的目的是在文档中加上说明,方便以后阅读和修改。注释标记的格式为:!--注释的具体内容--注释并不局限于一行,长度不受限制。结束标记与开始标记可以不在一行上。文字简历北京中医药大学信息中心HTML的图像和颜色北京中医药大学信息中心【颜色的表示方法】颜色的表示方法有以下四种:颜色名称表示法,如red、green、blue、black、white等。十六进制的三基色饱和值表示法,如#ff0000为红色、#000000为黑色。十进制的三基色饱和度表示法,如RGB(0,255,0)为绿色。百分比的三基色饱和度表示法,如RGB(100%,100%,100%)为白色。以上四种表示方法,使用时可任选一种。下面这行代码用其中三种颜色表示方式定义了一个网页的配色方案。bodybgcolor=#006600text=yellowlink=rgb(255,0,0)body标记中的bgcolor属性是用来指定网页的背景颜色,text属性用来指定网页中文本的颜色,link属性用来指定网页中超链接的颜色。HTML的图像和颜色北京中医药大学信息中心【网页中的图像格式】能在网页上不加插件直接显示的图像格式有GIF、JPG和PNG。GIF格式的图像颜色数有256色,所以GIF适合用来制作插图、剪贴画等对色彩要求不高的场合。JPG格式的图像颜色数可达真彩色,可处理各种连续的彩色或灰度图像。PNG格式的图像目前用得不是很多。HTML的图像和颜色北京中医药大学信息中心【在网页中插入图像标记img】img标记是一个单一标记,用于在网页中插入图像。imgsrc=“图像名称”width=“宽度”height=“高度”alt=“替代文本”border=“数值align:指定图片与周围文本的对齐方式.top——文本与图片在顶部对齐middle——文本与图片在中央对齐bottom——文本与图片在底部对齐left——图片居左,文本在图片的右边right——图片居右,文本在图片的左边vspace:指定图像与文本之间的垂直间距,hspace:指定图像与文本之间的水平间隔HTML的超链接北京中医药大学信息中心【超链接标记a…/a】ahref=“URL”target=目标窗口超链接/aa和/a标记之间的内容为链源,即为网页上的超链接。href属性的值是一个URL,是目标资源的有效地址。URL:链接路径分为绝对路径、相对路径和站点目录相对路径三种类型。Target:_blank(新建窗口),_self(同一窗口)HTML的超链接北京中医药大学信息中心【绝对路径】绝对路径给出所链接文档的完整URL,包括访问该文档所使用的协议。若要链接到其他服务器上的文档,就必须使用绝对路径,而在网站内部最好不要使用绝对路径。p绝对路径/pahref===“D:\中医药课程\网页制作\备课\第二章\资料\png14.
本文标题:基本标记
链接地址:https://www.777doc.com/doc-3218252 .html