HTML引见
日期：2014-05-17 浏览次数：20681 次
HTML介绍
?
?1.什么是 html:hypertext markup language
?????????????? 用来编写网页的语言,后缀是.html/.htm
??????????????
?????????????? 编写方式:任何文本编辑器
?????????????? 运行方式:浏览器解释运行
????
???? 2.浏览器
?????????????? IE/Firefox/Chrome/Safari/Opera
??????????????
???? 3.html文档的结构
?????????????? 版本信息:
???????????????????????? 严格型:xhtml1.0
???????????????????????? 过渡型:trans
???????????????????????? 框架型:支持框架元素
?????????????? <head>
?????????????? <body>
????
???? 4.head:与当前文档相关的整体设置
??????????????????? title:标题
??????????????????? meta:元数据
???????????????????????? http-equiv="refresh" content="3"
?????????????????????????????????? 定期刷新(数据的实时性):留言论坛/动态更新的新闻
??????????????????? style:
??????????????????? link:
??????????????????? script:
???????????????????
????????? body:文档的主体,包含页面的主要内容
??????????????????? 文本标记/超级链接和图像/表格/表单/列表/框架元素
????
???? 5.html 的基础语法
??????????????????? 双标记:<name></name>
??????????????????? 单标记: <name>
??????????????????????????????????????? <name />
??????????????????? 带属性的标记:<name attrname="value"></name>
???????????????????
??????????????????? 通用属性:几乎所有的元素都有的属性
????????????????????????????? title:添加提示文本信息
????????????????????????????? id:
????????????????????????????? style:
????
?????????????? 练习1:创建一个html文档,使用head中的元素
????
???? 6.文本标记
?????????????? 标题:h1--h6
?????????????? 段落标记:p----自成一个段落,保留段落间距
?????????????? 换行元素:br----回车换行,间距较小
?????????????? 特殊字符:转义符
?????????????? 分组元素:将一些元素分组，以实现样式的定义或者js代码的添加
??????????????????? div:独占一行--------块级元素
??????????????????? span:不会改变原有的布局---行内元素
????
???? 7.超级链接和图片
?????????????? 图像:<img src="http://www.dsfds/image/cat.jpg">
???????????????????????? <img src="../image/cat.jpg" title="">
????????????????????????????? 绝对路径/相对路径
?????????????? 超级链接:去往其他的url---页面间的切换
???????????????????????? <a href="url">text</a>
???????????????????????? target:设置新页面在哪个窗口打开
?????????????????????????????????? _self:当前窗口
?????????????????????????????????? _blank:新窗口或者新页签
??????????????????????????????????
???????????????????????? <a href="mailto:wangcm@tt.com.cn">联系我们</a>
???????????????????????? <a href="javascript:method();">click</a>
????????????????????????
???????????????????????? 同一个页面上不同部分之间的跳转:
?????????????????????????????????? 定义链接:<a href="#top">to top</a>
?????????????????????????????????? 定义锚点:<a name="top"></a>
??????????????
?????????????? 图像映射
???????????????????????? 为一幅图像添加一个链接:<a href=""><img></a>
???????????????????????? 为一幅图像添加多个链接
??????????????????? <map name="aaa">????
???????????????????????? <area shape="rect" coords="0,0,100,100" href="a.html">
???????????????????????? <area shape="circle" coords="50,150,50" href="b.html">
<
?????????????? 用来编写网页的语言,后缀是.html/.htm
??????????????
?????????????? 编写方式:任何文本编辑器
?????????????? 运行方式:浏览器解释运行
????
???? 2.浏览器
?????????????? IE/Firefox/Chrome/Safari/Opera
??????????????
???? 3.html文档的结构
?????????????? 版本信息:
???????????????????????? 严格型:xhtml1.0
???????????????????????? 过渡型:trans
???????????????????????? 框架型:支持框架元素
?????????????? <head>
?????????????? <body>
????
???? 4.head:与当前文档相关的整体设置
??????????????????? title:标题
??????????????????? meta:元数据
???????????????????????? http-equiv="refresh" content="3"
?????????????????????????????????? 定期刷新(数据的实时性):留言论坛/动态更新的新闻
??????????????????? style:
??????????????????? link:
??????????????????? script:
???????????????????
????????? body:文档的主体,包含页面的主要内容
??????????????????? 文本标记/超级链接和图像/表格/表单/列表/框架元素
????
???? 5.html 的基础语法
??????????????????? 双标记:<name></name>
??????????????????? 单标记: <name>
??????????????????????????????????????? <name />
??????????????????? 带属性的标记:<name attrname="value"></name>
???????????????????
??????????????????? 通用属性:几乎所有的元素都有的属性
????????????????????????????? title:添加提示文本信息
????????????????????????????? id:
????????????????????????????? style:
????
?????????????? 练习1:创建一个html文档,使用head中的元素
????
???? 6.文本标记
?????????????? 标题:h1--h6
?????????????? 段落标记:p----自成一个段落,保留段落间距
?????????????? 换行元素:br----回车换行,间距较小
?????????????? 特殊字符:转义符
?????????????? 分组元素:将一些元素分组，以实现样式的定义或者js代码的添加
??????????????????? div:独占一行--------块级元素
??????????????????? span:不会改变原有的布局---行内元素
????
???? 7.超级链接和图片
?????????????? 图像:<img src="http://www.dsfds/image/cat.jpg">
???????????????????????? <img src="../image/cat.jpg" title="">
????????????????????????????? 绝对路径/相对路径
?????????????? 超级链接:去往其他的url---页面间的切换
???????????????????????? <a href="url">text</a>
???????????????????????? target:设置新页面在哪个窗口打开
?????????????????????????????????? _self:当前窗口
?????????????????????????????????? _blank:新窗口或者新页签
??????????????????????????????????
???????????????????????? <a href="mailto:wangcm@tt.com.cn">联系我们</a>
???????????????????????? <a href="javascript:method();">click</a>
????????????????????????
???????????????????????? 同一个页面上不同部分之间的跳转:
?????????????????????????????????? 定义链接:<a href="#top">to top</a>
?????????????????????????????????? 定义锚点:<a name="top"></a>
??????????????
?????????????? 图像映射
???????????????????????? 为一幅图像添加一个链接:<a href=""><img></a>
???????????????????????? 为一幅图像添加多个链接
??????????????????? <map name="aaa">????
???????????????????????? <area shape="rect" coords="0,0,100,100" href="a.html">
???????????????????????? <area shape="circle" coords="50,150,50" href="b.html">
<
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
