<html>
<head>
</head>
<body bgcolor = "#ffooff">//设置网页背景颜色
<img src = "图片名">
alt 鼠标放在图片上时显示的文本
指定宽度和高度,这样页面在加载时就会先将位置占上
</img>
<font color="#ffooff">//文字设置
aaaa
</font>
</body>
</html>
<title></title>
<style type="text/css">
</style>
<script type ="text/javascript">
alert(new Date().toLocaleDateString());
</script>
注释符号
<!-- 欢迎使用 ASP.NET!-->
打印信息的语句和messagebox差不多
alert(new Date().toLocaleDateString());
<br/> 回车语句
<p> //分段标签 前后空白比较大
文字
</p>
<center>xxxx</center> 居中
h标签
只有<h1>到<h6>
<b>xxx</b>粗体
<font color = "#ff00ff size = "20"">xxxx</font>
超链接 <a herf="www.xxx.com">xxxx</a>
嵌套图片 <a href="www.xxx.xxx"><img src = "xxx"></a>
<a> target属性设置为_blank超链接在新窗口中打开
<a name="Last">这是最后</a>
页内跳转,跳转到超链接部分<a href="#Last">转到平台</a>
HTML不把“ ”当成空格,因为HTML中经常有缩进,如果把缩进空格显示出来排版麻烦
HTML中要显示空格使用#nbsp;
HTML中要显示 < 使用<
HTML中要显示 > 使用>
一般文字中可以使用
<pre>
文字
</pre>
无序的列表unordered list
<ul><li>xxx</li><li>xxx</li><li>xxx</li></ul>
有序的列表
<ol></ol>
表格标签
<table border ="1"边框><tr><td></td></tr></table>
tr创建行
td创建列
表头用thread表示,外观没变化<thread><tr><td></td></tr></thread>
<tr>属性 align 水平对齐 rowspan colspan 单元格合并
表单
<form action="">
input标签
<input type="text" size value maxlength readonly >//显示文本框
<input type="checkBox" checked>//复选框
<input type="submit">//提交按钮
<input type="button" value= "默认值">
file 文件选择框使用file form的enctype属性值必须设置为multipart/form-data method属性值为post
hidden 隐藏字段
image 图片按钮
<input type="image" src="图片">
password 密码框
radio 单选按钮 name ="组名"
reset重置按钮
</form>
select标签
区分ComboBox和ListBox看size的属性值 >1就是ListBox
ComboBox
ListBox
<select multiple = "multiple" >表示使用的是ListBox- 默认显示4个
<select size="1"//设置显示的个数 multiple = "multiple" 可以多选>
<option value=1 编号>xxx</option>
<option selected 选中状态>xxx</option>
<option value =-1> xxx </option>
</select>
<optgroup lable ="各个类名">对选项进行分类>
<option value=1 编号>xxx</option>
<option selected 选中状态>xxx</option>
</optgroup>
textarea 多行文本标签
<textrea cols="列数" row="行数">
默认内容
</textrea>
<label>文本标签
<hr />//分割线
label可以将获取焦点到它指定的对象上去
<label for="name">姓名:</label><input id="name" type="text" />
<label for="hunfou">婚否:</label><input id="hunfou" type="checkbox" />
fieldset: GroupBox效果,没有分组效果,只是隔开
<fieldset>
<legend>xxxx</legend>//标题
<input type="radio" name="x" />
<input type="radio" name="x" />
<input type="radio" name="x" />
<input type="radio" name="x" />
</fieldset>
css页面样式
<input type="text" value="1111" style="background-color:Gray; border-bottom-color:Red;color:Yellow " />
style 显示风格
background-color 背景颜色
color字体颜色
border-bottom-color:边框颜色
<head>
<title></title>
<style type="text/css">
input{background-color:red; border-bottom-color:Red;color:Yellow;}
div{background-color:Red;color:Yellow}
</style>
</head>
内连得方式将页面中所有的input显示的风格
文字使用div包含起来再设置风格
<div style="background-color:Red;color:Yellow">sdfasdfadfa</div>
将页面样式使用StyleSheet1。css 文件单独放起来。
再html文件中调用
<head>
<title></title>
<link type="text/css" rel="Stylesheet" href="StyleSheet1.css" />
</head>
span 将中间文字包含在一起,和前后的内容不分开
<span>xxxxxxxxsadasff</span>
div 将中间的文字包含在一起,和前后的内容分开,单独占一块
<div>xxxxxxx<input type="button" /></div>
css中的计量单位 px(像素)、30%(百分比)、em(相对单位)
borde-style默认是没有边框的,
cursor 鼠标在元素上时显示的光标图标
<div style="cursor:pointer;" >asdfasdf<u>sda dsafasdf</u> sdf asdf adsf</div>
给文字加下划线
<div>dffasfdasd<u>fas sad</u>f a</div>
LI不显示圆点 LIST-STYLE-TYPE:none
修改整个网页的光标
<body style="cursor:url(光标路径)">
定义样式,选择样式
自己也可以在body中定义风格,会覆盖掉选择器的风格,优先级高一点
class选择器
<head>
<title></title>
<style type="text/css">
.waring{background:yellow;}
.highlight{font-size:xx-large;cursor:help;}
</style>
</head>
<body>
<!--class选择器-->
<div class="waring">xxxx</div>
<div class="highlight waring" style="background-color:black">xxxx</div>
<div>xxxx</div>
<div>xxxx</div>
<div>xxxx</div>
<div>xxxx</div>
</body>
标签+class选择器
<head>
<title></title>
<style type="text/css">
input.accountno{text-align:right;color:Red;}
label.accountno{font-style:italic;}
</style>
</head>
<body>
<!--标签+class选择器-->
<input class="accountno" type="text" value="1111111111" />
<label class="accountno">aadssdsdfasdfa</label>
</body>
</html>
id选择器
<head>
<title></title>
<style type="text/css">
#usrname
{
font-size:xx-large;
}
</style>
</head>
<body>
<!--id选择器-->
<input id="usrname" type="text" value="xxxxx" />
</body>
</html>
关联选择器
<head>
<title></title>
<style type="text/css">
p strong{background-color:Yellow;}
</style>
</head>
<body>
<strong>xxxx</strong>
<!--p标签中的strong标签中的内容显示特定的风格-->
<p><strong>sdfasdfad</strong></p>
</body>
组合选择器
<head>
<title></title>
<style type="text/css">
<!--h1,h2,input 使用风格-->
H1,H2,input{background-color:Yellow;}
</style>
</head>
<body>
<h1>nihao</h1>
<input type="text" value="xcvxc" />
</body>
伪选择器
超链接风格
在单独的css文件中
A:visited {text-decoration:none}
A:active {text-decoration:none}
A:link {text-decoration:none}
A:hover {text-decoration:underline}
<head>
<title></title>
<link type="text/css" rel="Stylesheet" herf="link.css" />
</head>
<body>
<a href="HTMLPage为页面.htm">aaaa</a>
<a href="HTMLPageyagnshi.htm">bbbb</a>
</body>