广州市越秀区建设局官方网站,北京公司网页,成都优化外包,wordpress cmHTML网页设计 HTML网页设计1、常用的单标签2、常用的双标签3、列表标签4、超链接标签5、图像和动画标签6、Html5中音频的插入7、定时刷新或跳转8、表格9、HTML表单标签与表单设计 HTML网页设计
属性值一般用 括起来#xff0c;且必须使用英文双引号 head… HTML网页设计 HTML网页设计1、常用的单标签2、常用的双标签3、列表标签4、超链接标签5、图像和动画标签6、Html5中音频的插入7、定时刷新或跳转8、表格9、HTML表单标签与表单设计 HTML网页设计
属性值一般用 括起来且必须使用英文双引号 head/head是文档的头部信息说明文档的基本情况如文档的标题等其内容不会显示在网页中。此标签对之间可使用title/title 、script/script等描述HTML文档相关信息的标签对 body/body标签中常用的属性 bgcolor设置网页背景颜色 text设置文档中文本颜色 bacjground设置网页的背景图片 !-- 注释内容 --! 1、常用的单标签
br/换行hr/制作水平线img src图像和动画标签meta http-equivrefreshcontent1页面一秒刷新一次
例1、hr size5px aligncenter colorblue width80% align对齐属性center居中left左对齐默认right右对齐color颜色属性size字体大小属性其属性值为5px
2、常用的双标签
b/b黑体标签i/i斜体标签h#/h##1,2,3,4,5,6,定义了6级标题字体大小递减p/p段落标签align属性指定对齐方式address/address用来定义html文档或文章的拥有者的联系信息可以包括手机电话、联系地址、电子邮箱、微信号等联系信息ol/ol有序列表标签ul/ul无序列表标签li/li在ul/ul或ol/ol标签内使用形成列表项a href/a超链接
3、列表标签
1有序列表标签ol/ol 格式如下
!----
ol type序号类型li……/lili……/li……
/ol属性type指定列表项前项目符号的样式取值如下“1”编号为阿拉伯数字默认“a”小写英文字母“A”大写英文字母“i”:小写罗马数字“I”:大写罗马数字 2无序列表标签ul/ul 格式如下
!----
ul type序号类型li……/lili……/li……
/ol属性type指定列表前项目符号的样式取值为disc:实心圆点默认circle空心圆点square:实心方块
4、超链接标签
格式a href转向的网址或文档target目标框架值超链接名称或图片/a 属性href用于指定连接的目标另一个网页的路径。 属性target设置单击超链接时打开网页的目标框架可以选择_blank(新建窗口)_parent(父框架),_self(在同一窗口中打开是默认设置值)和_top(整页)等目标框架
5、图像和动画标签
格式img src heightwidthborderalt 属性src指定图像的路径分为绝对路径和相对路径 绝对路径: .表示当前文件所在的目录 ..表示当前文件所在的上一级目录 文件名表示当前文件所在目录文件相当于./文件名./可以省略 绝对路径 正确格式http://ip:prot/工程名/资源路径 错误格式盘符:/目录/文件名 属性height:图片高度属性width:图片宽度属性border:设置图像边框属性alt(或title):当图片显示不出来是用需要替代的文本
图像和动画标签可以组合使用例如
a hrefimg srcwidthheightalt
/a6、Html5中音频的插入
audio src地址,autoplayautoplay,controlscontrols,controlscontrols,looploop音频/audioautoplay:音频在就绪后马上播放controls:显示控制面板启动中止等按钮;loop:循环播放
7、定时刷新或跳转
1定时刷新语法meta http-equivrefreshcontent1/ 该语句表示页面每隔一秒刷新一次属性content的值代表间隔的时间。 2定时自动跳转语法meta http-equivrefreshcontent3;urlhttp://www.sohu.com/ 该语句表示页面3秒后自动跳转到搜狐页面 (1)和2一般放在head标签中
8、表格
表格由行、列、单元格组成可以很好地控制页面布局固定文本或图像的输出还可以任意进行背景和前景颜色的设置。 基本语法 tablecaption列表标题/captiontrth列名一/thth列名二/th/trtrtd数据二/tdtd数据二/td/tr/table属性border设置单元格边框0无1有width设置宽度height设置高度align在table标签中表示设置表格相对于页面的对齐方式在td标签中表示单元格文本的对齐方式valign是tr属性中单元格内容的对齐方式top顶端对齐middle中间对齐bottom底端对齐
colspan设置跨列rowspan设置跨行cellpadding设置单元格边框与内容之间的距离bgcolor设置表格背景颜色也可设为某行或某个单元格颜色background:设置表格背景图像 注意特别注意tr一定放在table中th和td一定要放在tr中
9、HTML表单标签与表单设计
基本语法form name表单名称method提交方法actoin提交服务器的地址……/form
input name输入域名称type类域名value输入域的值input主要有6个属性type、name、size、value、maxlength、check。其中name和type是必选的两个属性。那么属性的值是响应程序form标签中的action属性指定,只要发给服务器必须带上name标签的变量名。type的格式和含义如下
input typetext是文本输入框value设置默认显示内容input typepasswork是密码输入框value设置默认显示内容Maxlength设置最多能输入几位密码input typeradio是单选框name属性可以进行分组checked“checked”表示默认选中input typecheckbox是复选框checkedchecked表示默认选中input typereset是重置按钮value属性修改按钮上的文本input typesubmit是提交按钮value属性修改按钮上的文本input typebutton是按钮value属性修改按钮上的文本input typefile是文件上传域input typehidden是隐藏域input typeselect是下拉列表框option是下拉列表框中的选项selectedselected表示默认选中input typetextarea表示多行文本输入框rows属性设置可以显示几行的高度cols属性可以设置每行可以显示几个字符宽度
form和table标签可以联用是表单更整洁
用户注册
formtable aligncenter……/table
/form