一、HTTP是网页的载体
css样式是表现(颜色等)
java script实现网页的特效
<html></html>
称为根标签,所有的网页标签都在<html></html>中。
<head>
标签用于定义文档的头部,它是所有头部元素的容器。头部元素有<title>
、<script>
、 <style>
、<link>
、 <meta>
等标签,头部标签在下一小节中会有详细介绍。
在<body>
和</body>
标签之间的内容是网页的主要内容,如<h1>
、<p>
、<a>
、<img>
等网页内容标签,在这里的标签中的内容会在浏览器中显示出来
注释: <! >
二、语义化
网页显示的内容放在<body></body>
段落:<p>段落文本</p>
标题文本:<hx>标题文本</hx>
(x为1-6)
强调:<em> 表示强调,<strong> 表示更强烈的强调,并且在浏览器中<em> 默认用斜体表示,<strong> 用粗体表示
语法:<em>需要强调的文本</em>
<strong>需要强调的文本</strong>
<span>标签是没有语义的,它的作用就是为了设置单独的样式用的。
短文本引用:<q> </q> 显示为双引号“ ”
长文本引用:<blockquote>引用文本</blockquote>
回车:<br />标签作用相当于word文档中的回车。在网页中回车,空格无作用
空格:
添加水平横线:<hr />
添加地址:<addresss>地址</address>
添加代码:<code>代码语言</code>
添加大段代码:<pre>语言代码段</pre>
添加列表信息:
- ......
添加列表信息
......
表格:
1、<table>…</table>:整个表格以<table>
标记开始、</table>
标记结束。
2、<tbody>…</tbody>:当表格内容非常多时,表格会下载一点显示一点,但如果加上<tbody>标签后,这个表格就要等表格内容全部下载完才会显示。如右侧代码编辑器中的代码。
3、<tr>…</tr>:表格的一行,所以有几对tr 表格就有几行。
4、<td>…</td>:表格的一个单元格,一行中包含几对<td>...</td>
,说明一行中就有几列。
5、<th>…</th>:表格的头部的一个单元格,表格表头。
6、表格中列的个数,取决于一行中数据单元格的个数。
为表格加入边框
摘要:<table summary="表格简介文本">
标题:
… | … | …
链接到另一个页面:
链接显示的文本 例:click here!
在新建浏览器窗口打开:
click here!
网页中插入图片:
<img src="图片地址" alt="下载失败时的替换文本" title = "提示文本">
1、src:标识图像的位置;
2、alt:指定图像的描述性文本,当图像不可见时(下载不成功时),可看到该属性指定的文本;
3、title:提供在图像可见时对图像的描述(鼠标滑过图片时显示的文本);
4、图像可以是GIF,PNG,JPEG格式的图像文件
表单标签:
1.<form> :<form>标签是成对出现的,以<form>开始,以</form>结束。
2.action :浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。
3.method : 数据传送的方式(get/post)
文本输入框、密码输入框:
文本域,支持多行文本输入
<textarea
rows="
行数"
cols="
列数"
>
文本</textarea>
单选框、复选框
1、type:
当 type="radio" 时,控件为单选框
当 type="checkbox" 时,控件为复选框
2、value:提交数据到服务器的值(后台程序PHP使用)
3、name:为控件命名,以备后台程序 ASP、PHP 使用
4、checked:当设置 checked="checked" 时,该选项被默
下拉列表:
1、value:
2、selected="selected":
设置selected="selected"属性,则该选项就被默认选中
下拉列表多选:
在<select>标签中设置multiple="multiple"
属性,就可以实现多选功能,
提交按钮:提交按钮、重置
<input type="submit" value="提交">
type
:只有当type值设置为submit时,按钮才有提交作用
value
:
按钮上显示的文字
重置按钮:
<input type="reset" value="重置">
type
:只有当type值设置为reset时,按钮才有重置作用
value
:
按钮上显示的文字
label标签:
<label for="控件id名称">
类选择器:
.类选器名称{css样式代码;}
例:
胆小如鼠
id选择器:
例:
公开课
我