HTML
程序员文章站
2022-04-24 15:35:28
...
互联网的基石
统一资源定位符(URL)
互联网上每个资源都对应一个单独的URL
超文本传送协议(HTTP, HyperText Transfer Protocol)
它负责规定浏览器和服务器怎样互相交流
超文本标记语言(HTML,HyperText Markup Language)
作用是定义超文本文档的结构和格式
HTML文本是由HTML命令组成的描述性文本,
HTML文件必须有htm或者html扩展名
HTML命令可以说明文字、图 形、动画、声音、表格、链接等。
HTML的结构包括头部(Head)、主体(Body)两大部分,其中头部描述浏览器所需的信息,而主体则包含所要说明的 具体内容
heab
<head>元素出现在文档的开头部分。<head>与</head>之间的内容不会在浏览器的文档窗口显示,但是其间的元素有特殊重要的意义:
对文档做整体的控制
<title>元素定义HTML文档的标题。<title>与</title>之间的内容将显示在浏览器窗口的标题栏。
<meta>
<meta name="keywords“ content="study,computer">
用来标记搜索引擎在搜索你的页面时所取出的关键词。
<meta name=“description“ content=“java,html">
这个 Meta 元素定义了对页面的描述:
<meta name="author" content=“puckasoft">
用来标记文档的作者。
<meta http-equiv=“Content-Type” content=“text/html; charset=gb2312”>
用来标记你的页面的解码方式。
<meta http-equiv=“refresh” content=“5;URL=http://www.163.com”>
用来自动刷新网页
一个典型的head
<head>
<title>典型的head</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="refresh" content="5;URL=http://www.163.com">
<meta http-equiv="expires" content="0">
<meta name="author" content="zhangsan">
<meta name="description" content="java">
<meta name="keywords" content="JAVA,音乐,生活">
<link rel="stylesheet" type="text/css" href="css/pagination.css" />
<script type="text/javascript" src="js/search.js"></script>
</head>
body
<body>元素表明是HTML文档的主体部分。在<body>与</body>之间,通常都会有很多其它元素;
这些元素和元素属性构成HTML文档的主体部分
<body>元素的属性
bgcolorbgcolor属性将背景设置为颜色,它的值可以是一个十六进制数、RGB值或者一种颜色名称。
<body bgcolor="#000000">
<body bgcolor="black">
backgroundbackground属性将背景设置为图像,它的值是你所要使用图像的URL地址。
图像文件的容量尽量不要超过10K。
<body background=“./images/sky.jpg” >bgcolor和background不能同时使用!
常用标签(文字操作)
<p>-段落(paragraph)-(4.html)
标签<h1>到<h6>标题元素。<h1>定义了最大的标题元素,<h6>定义了最小的。 (5.html)
<br>或者<br/>换行标签。
<!-- This is a comment --> html中的注释。浏览器将会忽略。
<hr size=“9” width=“80%” color=“red” >水平线
<del>twenty </del>删除文字
<b>...</b>粗体字(bold)
<i>...</i>斜体字 (italic)
<font color=“red” size=“1”>...</font> 1是最小字体…
<SUB> 下标(subscript)
<SUP> 上标 (superscript)
<pre>代码标记,保持原格式
<span> 文字域标记 只有设置样式才起到作用
<div> 章节段落域标记 多用于布局页面
HTML常用标签(超链接)
<a href=“5.htm”>5.htm</a> 超链接
图片作为链接。
<a href="lastpage.htm"> <img border="0" src=".\images\next.gif">
</a>
target属性(定义从什么地方打开链接地址 )
<a href="http://www.163.com/" target="_blank">163!</a>
点击aaaa会在nnnnn中打开
<a herf="12306" target="myframe">aaaa</a>
<iframe src="baibu" name="myrame">nnnnn</iframe>
锚标签和name属性
命名一个锚点:
<a name="label">Text to be displayed</a>
链接到锚点:
<a href="http://www.w3schools.com
/html_links.asp#label">Jump to the label</a>
-------
<a name="mytop">顶部</a><br />//这段代码写在最前端
<a href="#mytop">返回顶部</a> 跳到mytop锚点处
HTML常用标签(图像)<img >
标签的属性
src:图像文件地址
width:图像宽
height:图像高
border:图像边框
title:表示鼠标在图片上停留时,显示一个文字悬浮框。
alt:用于图片没显示时,显示一个说明文字。
<img src="../img/披风侠.jpg" width="200xp"
height="300xp" title="披风侠" alt="披风侠"/>
音频视频播放标签
<embed>
标记用于在页面中嵌入多媒体文件,但是用户计算机上需要事先安装相应的处理程序.
(一般用于IE和基于IE内核的浏览器。火狐需要安装插件才行。)
常用嵌入式文档的格式:
mp3, mid, wma, asf, swf, flv, rm, ra, ram, avi
<embed src='http://player.youku.com/player.php/sid/XMTcxOTEzMjE0OA==/v.swf'
allowFullScreen='true' quality='high' width='480' height='400' align='middle'
allowScriptAccess='always' type='application/x-shockwave-flash' ></embed>
音频
<audio controls>
<source src="horse.mp3" type="audio/mpeg">
<source src="horse.ogg" type="audio/ogg">
Your browser does not support this audio format.</audio>
视频
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>