HTML(一)

1.软件结构分类

C-S结构(client - server 客户端-服务器端)

典型软件:qq

特点:①必须安装客户端服务器

②服务器端升级,客户端也得同步升级

B-S结构(broswer - server 浏览器-服务器端)

典型软件:百度,淘宝等网站

特点:①不需要特定的客户端,只需要浏览器

②服务器端升级,浏览器不用升级

网站:服务器端的软件都是基于bs结构的,这个软件俗称叫“网站”。网站是由网页组成。一个网         页就是由html页面组成。html是一门网页制作的语言。

2.HTML标签

①<html>  -- HTML开始标签

<head> -- 文件头(在浏览器主体中看不到,为了告诉浏览器怎么解释这个页面)

</head>

<body> -- 文件体(在浏览器主体中可以看到内容)

</body>

</html> -- html结束标签

<html>

<head>

<!-- html注释  -->

<!-- 标题 :在窗口的标题栏看到-->

<title>在这里添加标题</title>

<!--

html标签分类:

有标签体标签:有开始,有结束标签、 <title></title>

没有标签体标签 : 也叫空标签 <meat  />

-->

<meta http-equiv="content-type" content="text/html;charset=utf-8"/>

<!-- 关键词:keywords

搜索引擎: 百度    输入  java

关键词是网页排名的一个因素。

-->

<meta name="keywords" content="java,jdbc,php" />

<!-- 描述:

标题

描述

标题

描述

-->

<meta name="description" content="java是一种面向对象语言"/>

</head>

<body>

</body>

</html>

②文本标签(body里面的标签)

标题(h1~h6) align:设置位置

水平线(hr) color:线的颜色

换行(br)

标签规定粗体文本(b)

将文本以斜体显示(i)

将文本以下划线显示(u)

段落(p)

段落缩进(blockquote)(主要用于解释或者强调)

上下标(sup和sub)(一般用于公式)

原样输出(pre)(希望网页上的东西和代码里面写的样式完全一样的时候

marquee:

behavior属性值(alternata:来回滚动 scroll:重复滚动 slide:不重复滚动

bgcolor:字幕背景颜色

direction:设置字幕的滚动方向down  right  left  up

bgsound:

rc:需要播放的音乐路径

loop=-1(无限循环)

autostart="true"自动播放

③列表标签:

有序列表ol li(type属性更改序号类型)

无序列表ul  li(用于条目的罗列,type属性更改序号类型)

项目列表标签(dl dt dd)(一般用于有层次结构的列表,一个公司员工的列表)

下拉选项:<select/><option/>

行内标签(span) (html中用的非常少,css中用的非常多)

块标签<div> (html中用的非常少,css中用的非常多)

④超链接标签

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"                                             "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>超链接标签</title>

</head>

<body>

常用的属性:

href  表示链接到的地址(文件)

target  打开资源方式     _self: 当前窗口打开, _blank: 新窗口打开

协议执行资源的基本流程(超链接的原理):

使用协议到本地计算机的注册表中查询是否有对应协议的软件(程序),有就执行,没有就不执              行。

发布个人网站的流程:

1.域名

2.服务器

3.服务器ip和域名进行绑定

4.将网站发布到服务器

常见的协议:

file://   本地文件协议(本地或局域网)  在href中不写就是使用这个默认协议

http://    http协议(执行流程)  通常连接到域名或IP地址

thunder:// 迅雷下载软件的协议

mailto:发送邮件协议

超链接作用;

1)链接到资源

2)作为锚点使用

打锚点: <a name="锚点名称"></a>

去掉锚点: <a href="#锚点名称">内容</a>

图像标签

img 图像标签

常用属性:

src=\‘#\‘" /p>

width: 图片宽度

height: 图片高度

alt: 替代文本。当图片的src属性失效时,alt属性的内容就会生效

title: 提示文本。当鼠标放到图片上面出现。

地图(热点区域):map

热点: area,设置图片上可以被点击的区域(用工具做之后进行简单分析)

3.转义字符

在html语法中,存在一些特殊的字符,这些字符是不能直接原样输出。如果想让这些特殊字符原样        输出的话,那么就需要进行转义。

常见的转义字符:

特殊字符     转义字符(以&开头,以;结尾)

空格       &nbsp;

版权       &copy;

商标   &reg;

表格标签(画图讲解表格标签中的各个位置代表的标签)

标签:

table 表格

tr   行

td   单元格

th   表头

caption  标题

常用的属性:

border  表格的边框

width  宽度

heigth 高度

align   对齐方式。 left: 左对齐   center:居中  right:右对齐

rowspan  行合并。把多行的单元格合并

colspan  列合并。把多列的单元格合并

表单标签:

<form>   就是一个表单

<input type="text">  单行输入域

<input type="password"/>  密码输入域

<input type="radio"/> 单选按钮

<input type="checkbox"/> 多选按钮

<select/>  下拉选项

<input type="hidden"/>   隐藏域。特点:不会显示到html页面上,但可以携带数据。

<input type="file"/>  文件选择器

<textarea></textarea>  多行输入域

<input type="submit"/>  提交按钮

<input type="button"/> 普通按钮

<input type="reset"/> 重置按钮

框架标签

frameset 框架集

属性:

cols: 按照列的方向来划分框架

rows: 按照行的方向来划分框架

以上两个属性的值填每个框架的比例或者长度

*号表示其他框架分配完之后剩下的比例

frame 表示一个框架,框架中包含一个html页面有2个或2个以上的frame就会包含在frameset当中。

注意:框架标签不能放在body标签中,否则无法显示。

时间: 2024-10-13 15:58:36