网页基础知识与标签

网页基础知识

一.基本结构

1.html：超文本标记语言

基本结构

<html>开始标签
<head>
  网页控制信息
<title>页面标题</title>
</head>
<body>
页面显示的内容
</body>
</html>

2.网页分为静态页面（代码写死的）和动态页面（php.jsp.aspx）

3.路径分为绝对路径（根 "/"）和相对路径(当前目录"./" 上级目录"../")

二.网页的基础语法

1.单标签：<标签属性名>或<标签属性名/>一般起控制性作用

2.双标签：<标签属性名>内容</标签>或<标签属性名/>一般作为主要容器

3.注释：注释用，在网页中不显示

三.常用标签和属性

1.基础标签

<html></html>代表网页
<head></head>头标签
<meta/>编码格式
<title></title>标题标签
<body></body>主体标签 属性<bgcolor>背景颜色<text>文本颜色<background>背景图片<topmargin>上页边距

2.格式控制标签

<font color="" face="" size=""></font>颜色 字体 大小(最大到7）
<b></b><strong></strong>加粗
<i></i><em></em>倾斜
<u></u>下划线
<center></center>居中
<br></br>换行
&nbsp； 空格

3.内容标签

<h1></h1>.......<h6></h6>标题标签 自动换行 从大到小
<p></p>段落标签 自动空行
<div></div>层标签 默认占一行
<span></span>层标签 用多少占多少
<ol type="1"></ol>有序列表 <!--1的意思为序号1,2,3 引号中可更改序号形式-->
    <li></li>
    <li></li>
<ul></ul>无序列表

4.超链接标签

<a href="">指向内容（图片网页文本不用下载)</a>

做锚点：做锚点标签<a name="b"></a>

做锚点链接<a href="#b"></a>

5.图片标签

<img src="" width="" height="" alt="" title=“”“ />图片地址宽跟高设一个即可（按比例缩放）文字（无图片帮助）标题（指针显示）

6.表格标签

<table></table>表格
<tr></tr>行
<td></td>列，也称单元格
属性：width宽度 height行高 border边框粗细 cellspacing单元格与单元格之间的距离 cellpadding单元格与内容之间的距离 align水平对齐 valign垂直对齐 bgcolor背景颜色 background背景图片

7.表单标签

<form method="get/post" action=""></form>表格  提交方式=显性提交有长度限制/隐形提交无长度限制  提交服务器地址
文本输入
<input type="text" name="" value=""/>文本框 名称 输入值
<input type="password" name="" value=""/>密码框
<input type="hidden" name="" value=""/>隐藏框
<textarea name="" rows=""></textarea>文本域  几行高
按钮
<input type="submit" value=""/>提交（点击转到form内的服务器地址） 输入值
<input type="reset" value=""/>重置
<input type="button" value="" disabled="disabled"/>按钮 使按钮失效
<input type="image" src="">图片按钮 图片地址
选择按钮
<input type="radio" name="" value="" checked="checked" id=''1'' />单选按钮组 名称（需要一样）输入值 默认选项  标记（唯一）
<input type="checkbox" name="" value= ""/>多选按钮组
<input type="file" name=""/>文件上传
<lable for="1"></lable>触发标记标签
下拉列表
<select name="" size="" multiple="multiple">size为1时为菜单；>1时为列表 multiple为多选  
    <option value="">选项1</option>
    <option selected="selected">选项2</option>设为默认选项
    <option>选项3</option>
</select>

其他
readonly="readonly" 只读
disabled="disabled" 不可用，同时不能提交。
hidden="hidden"隐藏

除了按钮都要写name，按钮都要写value

8.框架（需去掉body）

<frameset cols="200,*" frameset="1">框架 左右分，左边200像素，右边剩余全部  框架粗细为1 上下为rows
<frame src="页面地址">   <!--插入的页面在框架的左边-->
</frameset>

<iframe src="其他页面地址" width="" height="" frameborder="1" scrolling="no"></iframe>在原页面嵌入小窗口显示其他页面。
frameborder:边线；scrolling:滚动条；

9.其他标记

滚动标记<marquee direction="">内容/图片</marquee>滚动方向
<mark></mark>标记
<hr/>分割线
页面嵌入视频：在视频左下方点击分享，复制HTML代码粘贴即可。