HTML
1.html基础
(1)什么是html?
hypertext markup language,超文本标记语言。
用于开发网页的语言,由浏览器解释执行。(W3C tim berners lee创立的 web之父html也是他发明的,我们要纪念一下,要怀着感恩的心去理解他的发明。)
html文件以.html/.htm结尾。(8.3早期window点号后面只能有三个字符,所以只能用htm)
(2)html的文件的基本结构
<html>
<head>
<title>标题</title>
<!--用于模拟服务器http消息头-->
<!--比如以下消息头的作用,是
告诉浏览器,返回的是一个html并且
应该以gb2312的编码来显示该页面
,html文件保存的编码应该与meta
声明的编码一致-->
<meta http-equiv="content-type"
contnet="text/html;charset=gb2312">
<!--引入脚本js-->
<script>干嘛的!以后再说
<!--定义样式-->
<style>
<!--引入外部样式-->
<link>
</head>
<body>
<!--页面显示数据-->
</body>
</html>
(3)web开发标准
w3c (www.w3cschool.com)
建议开发一个页面,应该这样子设计:
页面的结构(包括了数据),由html文档来负责
页面的外观,由css文档来负责。
页面的行为,由javascript文档来负责。
(4)列表
a.无序列表
b.有序列表
c.列表嵌套
(5).其它标记
<h1>...<h6>:标题
行内标记:
不单独占一行的标记
<span></span>
<strong>加粗</strong>
块级标记:
另起一行的标记
<h1>.....<h6>
<p>
<div>(用来布局)
(6)html/xhtml
xhtml:扩展的超文本标记语言。
w3c按照xml语法要求重新定义了html中的标记与相应的属性。
比如:1.标签必须层层嵌套
2.属性必须用""引起来
3.标签必须要有结束标签
4.尽量使用小写。
<font size=red>:error!
<font size="red">:ok!
<br>:error!
<br/>:ok!
html/xhtml文档类型声明 (加上好但是不加也无所谓)
xhtml过渡型
xhtml严格型
html严格型
html松散型(一般就加这个)
2.
链接
基本语法
<a href="链接打开的位置" target="链接内容在哪里打开">描述文字或者加图片</a>
target=链接内容在哪里打开 _blank:在新的窗口打开 _self:在当前窗口打开
如果不设置target属性,默认值为_self
锚链接、锚点
命名一个锚点
<a name="top"></a>
跳转到锚点
本页面跳转到锚点
<a href="#top">to top</a>
从另一个页面跳转到当前页面的锚点
<a href="h.html#top">to top</a>
功能链接
发送邮件!
<a href="mailto:电子邮箱">[联系我们]</a>
特殊符号
在页面中年,如果有空格出现( )引号(") >(>) <(<) @(©)要使用相应的实体来代替,主要目的是避免浏览器的解析出错
两个空格相当于一个汉字
一个空格相当于一个英文字母
表单
表单基本结构
<form action="abc.do"method="">
input标记
非input标记
</form>
<input name="表单元素名称" type="类型" value="值" size="显示宽度" maxlength="对大长度" checked="是否选中" />
action属性:表单提交的内容由哪个程序来处理
method属性:表单提交的方法
input标签
input type="text"/"password"/"button"/"checkbox"/"radio"/"hidden"/"file"/"reset"/"submit"
非input标签
select既可以用于下拉菜单,也可以用于多选框(multiple) textarea button img
列表
无序列表
<ul>
<li>内容填充在列表项里</li>
</ul>
有序列表
<ol>
<li>内容填充在列表项里</li>
</ol>
列表的嵌套
框架
什么是框架
将一个窗口划分为多个子窗口,每一个子窗口可以放置一个页面。
frameset:
iframe:
frameset页面中不能出现body,而iframe可以用在body标签里
3.
块级元素可以分为以下几类:块级元素按照其应用于结构还是内容分为三种:结构化块状元素,终端块状元素,多目标块状元素。
一.结构化块状元素
这类元素用于构造文档的结构,一个好的文档结构对于搜索引擎和应用其他技术(如JavaScript)都是十分有利的。它们没有语义上的含义,仅仅划分出了文档的组织方式,并 没有体现文档的内容。
主要的结构化块状元素
<ol> <ul> <dl> <table>
支持结构化的元素
<li> <dt> <dd> <caption> <thead> <tbody> <tfoot> <colgroup> <col>
二.终端块状元素
这类元素用于从结构转向内容,它们拥有语义上的含义,能够表明内容的性质。终端块状元素属于结构的终点,它们不能再包含其他块级元素,只能包含文本或行级元素。
终端块状元素
<h1>...<h6> <p> <blockquote> <dt> <address> <caption>
三.多目标块状元素
所谓多目标指的是可以自由的扩展或嵌套文档的结构,以可以终端的形式出现。当多目标块状元素以结构化的方式使用时就含有结构化的内涵,以终端的形式使用就含有语义的内涵。
多目标块状元素既可以包含块状元素,也可以包含内容(文本与行级元素的组合为内容),但不能同时包含两者。应该把内容放在块状元素中。块状元素不应作为行级元素与文本的兄弟元素,受HTML校验器的限制,目前还没办法检验出此种情况,但是应该避免。
多目标块状元素
<div> <li> <dd> <td> <form> <noscript>
从这里可要看到,HTML提供了7种元素——<div>、<li>、<dd>、<td>、<th>、<form>和<noscript>——来扩展或终止结构。所以,我把它们叫做多目标块状元素,因为它们是最多才多艺的元素。可以用它们来确定文档分区、列表项、词典释义、表格数据单元格、表格头部单元格、表单和当脚本无法运行时的可替换内容。
当多目标块状元素以结构化的方式使用时,它就拥有结构化的内涵。当以终端的方式使用它,它就拥有语义化的内涵。例如,当一个列表项作为终端的时候,其中的内容就成为某个列表中的一项。当列表项包含了一个结构化块状元素(例如表格或另一个列表)时,它从结构上就作为一个大的嵌套结构中的小节点起作用。
多目标块状元素既可以包含块状元素也可以包含内容,但是不能同时包含两种。文本与内联元素(图片、对象、控制元素和语义化的标记)的组合才构成了内容。块状元素不应该作为内联元素和文本的兄弟元素。我们把它称之为混合内容(mixed content)。应当把内容放在块状元素中——而不是放在它们之间。因为HTML文档类型定义语言中的限制,HTML校验器时常不能检测出拥有混合内容的文档,但是这不意味着就可以让此种情况出现。当浏览器遇到混合内容的时候,它会给内容套上一个匿名容器。这是因为当块状元素是按顺序排列的,而其中又穿插内容的时候,浏览器不能同时解析块状元素和内容。CSS选择符不能选择匿名块状元素,它会阻止你对其赋予样式。在使用这七类多目标块状元素的时候可以考虑经下细节:
<div>是一个分区。它通常是结构化的,但是它也能含有内容。如例子中所示,由分区创建的块状结构是不可见的,除非为每个分区赋予外边距、边框和/或内边距。
<li>是一个列表项。一般来说,它是一个包含内容的终端块状元素,不过它也能包含结构化块状元素(比如表格和列表)或终端块状元素(比如标题和段落)。
<dd>是定义列表中的一个定义。通常它是作为一个可包含内容的终端块状元素,但是它也可以含有结构化或终端的块状元素。
<td>和<th>是表格单元格。<td>是数据单元格,<th>是标题单元格。通常单元格是包含内容的终端块状元素,但是它们也可以包含结构化或终端的块状元素。
<form>是输入数据的表单。它可以含有结构化的块状元素,用于组织表单控制元素(如例中所示),或者直接包含内联表单控制元素(如“HTML结构”的那个例子所示)。它也能够包含终端元素(例如标题和段落)。
当浏览器不支持脚本的时候,就会显示<noscript>。它可以包含简单的内联内容或者拥有完整结构的文档。
xhtml和html的区别
xhtml:可扩展的文本标记语言
html:是一种松散的语言,大小写不敏感。
html有文档声明
第一行,写文档类型声明(可以省略)
XHTML 过渡型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 严格型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
HTML严格型
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML松散型
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
html书写规范
(1)标记有开始,也有结束,对于单个标签<br/><hr/>
(2)标记层层嵌套,并且嵌套要正确
(3)全部用小写
(4)属性值要用双引号引起来
如:width="200px"
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。