HTML+CSS学习笔记
2015-07-02 13:27
417 查看
1．文档格式化
1.1 文字格式化
（1）添加标准文字，可治愈<body>与</body>标记之间。
（2）改变文字属性。可用<font>标记。
（3）格式化文字。物理的和逻辑的。物理标记包括用于指定粗体的<b>标记，<i>斜体标记。逻辑标记，逻辑元素如<strong>标记和<em>标记。具体事例见HTML+css应用。
（4）特殊字符。有时需要在HTML文档中加入一些特殊的字符，如版权符号“”、”<”等。这些字符通常不能被浏览器直接识别，或者是浏览器的保留字符（如“<”符号用于标记）。通过使用一系列转换字符串来表示它们。如空格用“ ”来表示。“&”符号表示特殊符号的开始，“；”符号表示特殊字符的结束。两字符中间所代表的特殊字符英文含义的缩写。
1.2超链接和锚站。
线性文本和非线性文本。线性信息指按照直线发展的信息。从某点开始，按照某一路径，到另外一点结束。线性文本的上下文连贯。非线性文本中，杂志和字典是非线性文本的典型范例。
（1） 链接
超文本链接：连接不同超文本文件的方式称为超文本链接。
（2） 锚站元素，用<a>标记表示。
<a href=”url”>超链接文字</a>
命名锚站：用于创建指向同一页面中指定位置的链接。以便直接跳到此位置。命名锚站也叫做“书签”。
命名锚站的一般语法为：<a name=”书签名”>锚站A</a>
找到锚站：<a href=”#书签名”>单击此处将使浏览器跳到锚站A处</a>
1.3段落格式化
（1）段落标记
<p> </p>:可用align属性指定段落的对齐方式。如：<p aligh=”center”><b>居中对齐段落</b></p>
<div>、<span>、<address>、<blockquote>
其中<div>和<span>标记都可以将文档的结构分为一部分或多部分。分成几个逻辑部分后，结合样式表可分别控制它们的显示效果。
（2）预格式化段落标记
<pre>标记，保留录入原样显示。
2．使用图像和背景
2.1 在Web页中添加图像。
<img src=”图像文件url” alt=“替换文本”>
2.2 图片热区的链接
<map name=”FPMap”>
<area href=http://www.cumt.edu.cn shape=”rect” coords=”10,32,333,372”>
</map>
3．表格
表格的基本语法：<table></table> 定义表格
<caption></caption>定义标题
<tr> 定义表行
<th> 定义表头
<td> 定义表元（表格的具体数据）
4．表单
表单是前台页面和后台处理程序（ASP、JSP、CGI等）的接口。
4.1 <form>标签
语法格式为：<form></form> 属性有：name属性；method属性（Get方法、Post方法）；action属性（action=“accept.asp”表明表单中的内容提交给后台处理程序accept.asp来处理）；enctype属性（用来设置表单中信息的编码方式。取值有unknown与enctype，默认为unknown。需要上传文件时，需要设为enctype=”multipart/form-data”）
4.2 <input>标签
属性：name;value;maxlength;size;type(text、password、file、submit、reset、checkbox复选框、radio单选框)
4.3<textarea>标签
<textarea></textarea>
属性：name、cols（多行文本输入框的列数）、rows（设置多行文本的行数）、wrap（设置多行文本框中的文本超出文本列宽时是否换行，取值有virtual换行、physical换行、off不换行，默认为换行）
4.4<select>标签与<option>标签
主要用来定义列表框。语法格式为：<select></select>.
<select>标签必须与<option>标签配套使用，后者用于定义列表框的各个选项。<option>标签可以单独使用，也可成对使用。
<select>标签属性：name、size
<option>标签属性：value、selected
5．框架
使用Frames结构设计的HTML文件，能够将整个窗口分为几个独立的小窗口，每一个窗口可分别载入到不同的文件，每个窗口是可以互相沟通的。
<frameset>
<frame src=”url”>
<frame src=”url”>
</frameset>
5.1各窗口的尺寸设置
将窗口分割为几块，横向分窗口用ROWS属性，纵向分窗口用COLS属性，每一块的大小由这两个属性的值来实现。
<frameset cols=#> <frameset cols=”100,200,300”>
<frameset cols=”100,200,*”> <frameset cols=”100,*,*”>
<frameset cols=”*,*,*”>
<frameset rows=#> <frameset rows=”10%,20%,70%”>
（1） 纵向排列多个窗口
<framesetcols=“30%,20%,50%”>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>
（2） 横向排列多个窗口
<framesetrows=25%,25%,50%>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>
<Frameset>标签是可以嵌套使用的，也就是说，可以将其中某一个或某几个子窗口再划分为若干个更小的窗口。
<html>
<frameset cols="30%,90,*">
<framesrc="td1.html" name=cont>
<framesetrows="120,*">
<frame src="Tulip.jpg">
<frame src="蒲公英的约定.mp3">
</frameset>
<framesrc="td2.html" name=another>
</frameset>
</html>
5.2 各窗口间相互操作
由Frames分出来的几个窗口的内容并不是静止不变的，往往一个窗口的内容随着另一个窗口的要求而不断变化，这就提高了Frames的利用价值。为了完成各窗口之间的相互操作，我们必须为每一个窗口起一个名字，这个名字用属性Name来定义。
<framesrc=url name=“窗口名”>
例如：<frame src="a.html" name=“left”>
定义了窗口名称，还应该有Target来配合使用，Target属性指定了所链接的文件出现在哪一窗口。Target的值可以是name定义的名称，也可以是以下四类值：
<a href=urltarget=_blank> 显示一个新窗口
<a href=urltarget=_self> 显示在同一个窗口
<a href=urltarget=_parent> 显示在Frameset的前一份文件的窗口
<a href=urltarget=_top> 显示在整个浏览器窗口
1.1 文字格式化
（1）添加标准文字，可治愈<body>与</body>标记之间。
（2）改变文字属性。可用<font>标记。
（3）格式化文字。物理的和逻辑的。物理标记包括用于指定粗体的<b>标记，<i>斜体标记。逻辑标记，逻辑元素如<strong>标记和<em>标记。具体事例见HTML+css应用。
（4）特殊字符。有时需要在HTML文档中加入一些特殊的字符，如版权符号“”、”<”等。这些字符通常不能被浏览器直接识别，或者是浏览器的保留字符（如“<”符号用于标记）。通过使用一系列转换字符串来表示它们。如空格用“ ”来表示。“&”符号表示特殊符号的开始，“；”符号表示特殊字符的结束。两字符中间所代表的特殊字符英文含义的缩写。
1.2超链接和锚站。
线性文本和非线性文本。线性信息指按照直线发展的信息。从某点开始，按照某一路径，到另外一点结束。线性文本的上下文连贯。非线性文本中，杂志和字典是非线性文本的典型范例。
（1） 链接
超文本链接：连接不同超文本文件的方式称为超文本链接。
（2） 锚站元素，用<a>标记表示。
<a href=”url”>超链接文字</a>
命名锚站：用于创建指向同一页面中指定位置的链接。以便直接跳到此位置。命名锚站也叫做“书签”。
命名锚站的一般语法为：<a name=”书签名”>锚站A</a>
找到锚站：<a href=”#书签名”>单击此处将使浏览器跳到锚站A处</a>
1.3段落格式化
（1）段落标记
<p> </p>:可用align属性指定段落的对齐方式。如：<p aligh=”center”><b>居中对齐段落</b></p>
<div>、<span>、<address>、<blockquote>
其中<div>和<span>标记都可以将文档的结构分为一部分或多部分。分成几个逻辑部分后，结合样式表可分别控制它们的显示效果。
（2）预格式化段落标记
<pre>标记，保留录入原样显示。
2．使用图像和背景
2.1 在Web页中添加图像。
<img src=”图像文件url” alt=“替换文本”>
2.2 图片热区的链接
<map name=”FPMap”>
<area href=http://www.cumt.edu.cn shape=”rect” coords=”10,32,333,372”>
</map>
3．表格
表格的基本语法：<table></table> 定义表格
<caption></caption>定义标题
<tr> 定义表行
<th> 定义表头
<td> 定义表元（表格的具体数据）
4．表单
表单是前台页面和后台处理程序（ASP、JSP、CGI等）的接口。
4.1 <form>标签
语法格式为：<form></form> 属性有：name属性；method属性（Get方法、Post方法）；action属性（action=“accept.asp”表明表单中的内容提交给后台处理程序accept.asp来处理）；enctype属性（用来设置表单中信息的编码方式。取值有unknown与enctype，默认为unknown。需要上传文件时，需要设为enctype=”multipart/form-data”）
4.2 <input>标签
属性：name;value;maxlength;size;type(text、password、file、submit、reset、checkbox复选框、radio单选框)
4.3<textarea>标签
<textarea></textarea>
属性：name、cols（多行文本输入框的列数）、rows（设置多行文本的行数）、wrap（设置多行文本框中的文本超出文本列宽时是否换行，取值有virtual换行、physical换行、off不换行，默认为换行）
4.4<select>标签与<option>标签
主要用来定义列表框。语法格式为：<select></select>.
<select>标签必须与<option>标签配套使用，后者用于定义列表框的各个选项。<option>标签可以单独使用，也可成对使用。
<select>标签属性：name、size
<option>标签属性：value、selected
5．框架
使用Frames结构设计的HTML文件，能够将整个窗口分为几个独立的小窗口，每一个窗口可分别载入到不同的文件，每个窗口是可以互相沟通的。
<frameset>
<frame src=”url”>
<frame src=”url”>
</frameset>
5.1各窗口的尺寸设置
将窗口分割为几块，横向分窗口用ROWS属性，纵向分窗口用COLS属性，每一块的大小由这两个属性的值来实现。
<frameset cols=#> <frameset cols=”100,200,300”>
<frameset cols=”100,200,*”> <frameset cols=”100,*,*”>
<frameset cols=”*,*,*”>
<frameset rows=#> <frameset rows=”10%,20%,70%”>
（1） 纵向排列多个窗口
<framesetcols=“30%,20%,50%”>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>
（2） 横向排列多个窗口
<framesetrows=25%,25%,50%>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>
<Frameset>标签是可以嵌套使用的，也就是说，可以将其中某一个或某几个子窗口再划分为若干个更小的窗口。
<html>
<frameset cols="30%,90,*">
<framesrc="td1.html" name=cont>
<framesetrows="120,*">
<frame src="Tulip.jpg">
<frame src="蒲公英的约定.mp3">
</frameset>
<framesrc="td2.html" name=another>
</frameset>
</html>
5.2 各窗口间相互操作
由Frames分出来的几个窗口的内容并不是静止不变的，往往一个窗口的内容随着另一个窗口的要求而不断变化，这就提高了Frames的利用价值。为了完成各窗口之间的相互操作，我们必须为每一个窗口起一个名字，这个名字用属性Name来定义。
<framesrc=url name=“窗口名”>
例如：<frame src="a.html" name=“left”>
定义了窗口名称，还应该有Target来配合使用，Target属性指定了所链接的文件出现在哪一窗口。Target的值可以是name定义的名称，也可以是以下四类值：
<a href=urltarget=_blank> 显示一个新窗口
<a href=urltarget=_self> 显示在同一个窗口
<a href=urltarget=_parent> 显示在Frameset的前一份文件的窗口
<a href=urltarget=_top> 显示在整个浏览器窗口
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- css position属性 以及 float、display、position的问题整合
- CSS 鼠标样式大全
- 36种漂亮的CSS3网页按钮Button样式，总有你喜欢的
- checkbox复选框样式
- CSS3实现整屏切换效果
- css 雪碧图sprite的使用
- CSS里的各种水平垂直居中基础写法心得
- css中水平垂直居中对齐布局一些实例总结
- 为什么要初始化css样式。
- CSS3 立方体
- System.Web.Optimization对脚本和样式表的操作
- 网页头部声明lang=”zh-cn”、lang=“zh”、lang=“zh-cmn-Hans”区别
- css兼容tooltip提示框方法
- CSS3魔法堂：CSS3滤镜及Canvas、SVG和IE滤镜替代方案详解
- 引用css和js链接地址中带的问号是什么意思?
- css盒子模型
- CSS样式表
- (转)Seven Ways of Centering With CSS
- 样式表中的 element.style样式如何修改
- 简短的几句js实现css压缩和反压缩功能