HTML语法基础2(从西安电子科技大学JSP教程中整理)
图像标签
<img src="boy.gif" alt="男孩" align=right border=0 hspace=2 vspace=2 height=56 width=32>
src 指定图片位置 alt指定提示信息 border=0 hspace=2 vspace=2 指定了边界,左右大小空隙大小。
目前常见的网页图形格式有两种就是gif and jpg两种格式。gif格式只有256色。
基本用法 | 用法:<img src="图像文件名称, 路径">
-----------------------------------------------------------------------
原始码 | <img src="images/girl.gif">
-----------------------------------------------------------------------
基本用法 | 用法:<img src="图像文件名称" height="高度" width="宽度">
-----------------------------------------------------------------------
加上说明 | <img src="name.*" alt="说明">
-----------------------------------------------------------------------
图片位置 | <img src="name.*" align="位置">
| left top bottom middle right 其中靠左放可以造成文字环绕
-----------------------------------------------------------------------
路径写法
html文件的位置 | 图像文件的位置 | 写法 | 情形说明
-------------------------------------------------------------------------------
c:\demo | c:\demo |<img src="name.*"> | 图文都在同一目录
-------------------------------------------------------------------------------
c:\demo | c:demo\images |<img src="images/name.*"> |图在网页下一层目录
-------------------------------------------------------------------------------
c:\demo | c:\ |<img src="../name.*"> |图在网页上一层
-------------------------------------------------------------------------------
背景标签
<body bgcolor="#ffff00" background="bg.jpg">
当使用者链接到顶面时,若背景图案还没有传输完之前,就会先显现背景颜色
设定链接文字颜色设定
<body text="#000000" link="#0000ff" vlink="#ff00ff" alink=#ff0000">
text设定文字颜色。link设定"链接"的颜色.vlink设定"按下链接"的颜色。
alink设定"按下链结后"的颜色。
链接标签
网页内部的链接
(1)先在欲链接处作记号<a name="here1">这里是你想链接的点</a>
(2)设定链接:<a href="#here1">链接</a>
网页外部链接
<a href="协议+域名">外部链接</a>
链接标签的参数
target=_blank:将链接的画面内容,开在新的浏览视窗中。
target=_parent
target=_self
target=_top
表格标签
第一个步骤,利用<TABLE></TABLE>标签告诉电脑要做一个表格;
第二步骤,利用一组<TR></TR>标签先做一个横列,然后在横列
中利用几组<TD></TD>标签再分出栏,再做一横列然后再分栏。
<TABLE BORDER=1>
<TR><TD>1</TD></TB>
</TABLE>
<TABLE BORDER=1>
<TR><TD>1</TD><TD>2</TD><TD>3</TD></TR>
<TR><TD>4</TD><TD>5</TD><TD>6</TD></TR>
</TABLE>
合并表格栏
<TABLE BORDER=1>
<TR><TD COLSPAN=3>1</TD></TR>
<TR><TD>4</TD><TD>5</TD><TD>6</TD></TR>
</TABLE>
<TABLE BORDER=1>
<TR><TD ROWSPAN=2>1</TD><TD>2</TD><TD>3</TD></TR>
<TR><TD>4</TD><TD>5</TD><TD>6</TD></TR>
</TABLE>
表格宽度高度及字对齐
<TABLE WIDTH="100" BORDER="1" HEIGHT="60">
<TR><TD aglign=center>1</TD></TR>
</TABLE>
表格背景色
<TABLE BORDER=1>
<TR bgcolor="#ffff00"><TD>1</TD><TD>2</TD><TD>3</TD></TR>
<TR><TD>4</TD><TD>5</TD><TD>6</TD></TR>
</TABLE>
无序标签
可以加入TYPE="形态名称"属性来改变其符号形状,一共有三个选择:
DISK实心圆,SQUARE小正方形,CIRCLE空心圆
<UL TYPE="CIRCLE">
<LI>姓名:kaiwen
<LI>生日:1985
<LI>性别:m
</UL>
有序标签:可以选择不同的符号来显示顺序,一样是用TYPE属性来作更改,
有五种符号:1数字,A大写英文字母,a小写英文字母,I大写罗马字母,i小写罗马字母
<OL TYPE=I>
<LI>姓名:kaiwen
<LI>生日:1985
<LI>性别:m
</OL>
表单标签:
要做交互式网页很需要这种标签
各种输入类型:文字输入列:每个表单之所以会有不同的类型,原因就是在于
TYPE="表单类型"设定的不同而已,
第一个类型:文字输入列。文字输入列的形态就是TYPE="TEXT"
<form>
姓名:<input type="text" name="name" size="20">
</form>
可设定的属性
NAME="名称",是设定此一栏位的名称,程序中常会用到
SIZE="数值",是设定此栏位显视的宽度
VALUE="预设内容",是设定此栏的预设内容
ALIGN="对齐方式"TOP,MIDDLE,BOTTOM,RIGHT,LEFT,TEXTTOP向文字顶部对齐
BASELINE向文字底部对齐,ABSMIDDLE绝对置中,ABSBOTTOM绝对置下等
MAXLENGTH="数值",设定此栏可设定输入的最大长度
单选表单
利用TYPE="RADIO"。单选表单通常是好几个选项一起列出,一次只能先其一
<FORM>
性别:
男<INPUT TYPE="RADIO" NAME="SEX" VALUE="BOY">
女<INPUT TYPE="RADIO" NAME="SEX" VALUE="GIRL" CHECKED>
</FORM>
radio类型的表单,设定相同的名字,就可以组成一组了。
这种表单有一个特殊的属性:CHECKED,预设选项
复选框 TYPE="CHECKBOX"
密码表单 TYPE="PASSWORD"
在表单中,有一种送出按钮
TYPE="SUBMIT" 送出按钮 TYPE="RESET"清除重写按钮
还可以使用BUTTON属性
<FORM>
<INPUT TYPE="SUBMIT" VALUE="送出按钮">
<INPUT TYPE="RESET" VALUE="重新填写">
<INPUT TYPE="BUTTON" VALUE="按钮">
</FORM>
大量文字输入标签
可以利用<TEXTAREA></TEXTAREA>来产生一个可以输入大量文字的单元
<FORM>
请输入您的意见:<BR>
<TEXTAREA NAME="TALK" COLS="20" ROWS="3"></TEXTAREA>
</FORM>
下拉式选单
利用<SELECT NAME="名称">便可以产生一个下接式选单,另外
,还需要配合<OPTION>标签还产生选项
<FORM>
你喜欢看书吗?
<SELECT NAME="BOOK">
<OPTION VALUE="非常喜欢">非常喜欢
<OPTION VALUE="还算喜欢">还算喜欢
<OPTION VALUE="不喜欢">喜欢
</SELECT>
</FORM>
浙公网安备 33010602011771号