HTML基础知识总结
2017-07-07 09:59
302 查看
HTML课堂笔记
1.1 HTML基础知识
1.1.1什么是计算机语言?
人与人之间是通过语言进行交流,那么人和计算机之间如何交流呢?计算机只知道0和1,所以我们就通过0和1这种语系来和计算机交流,这就是计算机语言。
机器语言对于人来讲太难理解,编制程序太困难。为了解决这个问题,我们将一串特定的0和1进行符号化,这就是汇编语言。机器语言和汇编语言都是属于低级语言,即体现了机器的特性,而对于大多数不是计算机工程师的人来讲们还是太困难了。
高级语言:用类似英语加数学的符号来描述,最大程度屏蔽了机器特性,使得程序的阅读和编制变得越来越容易。(比如if语句)
常见的高级语言:Java、C、C++、C#、PHP等等
1.1.2什么是标记语言?
文本文件:只有内容没有格式。
例:在记事本中输入“带你出师,闯荡江湖!”。并设置相应的格式,但是接收过之后没有相同的格式,说明不包含任何格式信息。查看文字大小有20 字节。
在word中输入同样的内容,同时设置格式,在另一个电脑上看到的是同样的内容和格式。
浏览网页实际上就是将存储在服务器上的HTML文件下载到本地,然后通过浏览器进行解析并且呈现内容。
注释Ctrl+shift+/ <!-- --> 方便程序员阅读和理解
2.1
标题标签
标题(header)标签用于显示页面的标题信息。既包含了格式信息,同时提供了语义信息。
<h1>-<h6>字体大小依次递减
2.2
段落标签
段落(paragraph)标签表示页面的一个段落
<p></p> 自动换行
例:
<h3>静夜思</h3>
<p>李白</p>
<p>窗前明月光,</p>
<p>疑是地上霜。</p>
<p>举头望明月,</p>
<p>低头思故乡。</p>
2.3链接标签
链接标签<a>(anchor锚点)的作用是跳转,包括页间跳转和页内跳转。链接的是URL地址
* target属性指定打开目标页面的方式,其取值包括:
_blank:在新的页面中打开。
_self:在当前页面中打开。默认
_parent:这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中,那么它与目标 _self 等效。跨域问题
_top:这个目标使得文档载入包含这个超链接的窗口,用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口
* title 属性指定提示信息。
例:<a href="http://www.baidu.com/" target="_blank" title="点击可以去搜索">百度一下,你就知道</a>
2.3.1
页内跳转
在目标标签处指定id=””,在链接出指定href=”#”
* id属性是页面元素的唯一标识。
* name跳转只能用<a>标签
2.4图片标签<img>
* src:source,图片的URL 地址,可以是本地的,也可以是别的地方的地址。<imgsrc="img1.jpg">
* alt(altemative,可供替代的),当资源不存在时,可以替代显示文字内容。
路径:
绝对路径,通俗就是在哪里都可以找到的。
相对路径,
“../+”表示上一级目录 <img src="../img2.jpg">
“./”表示当前目录
“文件夹名/”表示下一级目录<img src="pic/img4.jpg" alt="资源不存在">
别的路径,<imgsrc="../chapter1/pic/img3.jpg" alt="资源不存在">
2.5
杂项
<span>:可以将部分文本独立出来。可以参考E101-02-06笔记
<br>:强制换行
<hr>:一条横线
<base>:标签规定页面中所有链接的基准 ,简化地址的书写。
<img
src="http://www.runoob.com/images/logo.png"alt="图片资源不存在"/>
<br>
<base
href="http://www.runoob.com/images/">
<img
src="logo.png"
alt="图片资源不存在"/>
2017.7.6周四
1.1 HTML基础知识
1.1.1什么是计算机语言?
人与人之间是通过语言进行交流,那么人和计算机之间如何交流呢?计算机只知道0和1,所以我们就通过0和1这种语系来和计算机交流,这就是计算机语言。
机器语言对于人来讲太难理解,编制程序太困难。为了解决这个问题,我们将一串特定的0和1进行符号化,这就是汇编语言。机器语言和汇编语言都是属于低级语言,即体现了机器的特性,而对于大多数不是计算机工程师的人来讲们还是太困难了。
高级语言:用类似英语加数学的符号来描述,最大程度屏蔽了机器特性,使得程序的阅读和编制变得越来越容易。(比如if语句)
常见的高级语言:Java、C、C++、C#、PHP等等
1.1.2什么是标记语言?
文本文件:只有内容没有格式。
例:在记事本中输入“带你出师,闯荡江湖!”。并设置相应的格式,但是接收过之后没有相同的格式,说明不包含任何格式信息。查看文字大小有20 字节。
在word中输入同样的内容,同时设置格式,在另一个电脑上看到的是同样的内容和格式。
浏览网页实际上就是将存储在服务器上的HTML文件下载到本地,然后通过浏览器进行解析并且呈现内容。
注释Ctrl+shift+/ <!-- --> 方便程序员阅读和理解
2.1
标题标签
标题(header)标签用于显示页面的标题信息。既包含了格式信息,同时提供了语义信息。
<h1>-<h6>字体大小依次递减
2.2
段落标签
段落(paragraph)标签表示页面的一个段落
<p></p> 自动换行
例:
<h3>静夜思</h3>
<p>李白</p>
<p>窗前明月光,</p>
<p>疑是地上霜。</p>
<p>举头望明月,</p>
<p>低头思故乡。</p>
2.3链接标签
链接标签<a>(anchor锚点)的作用是跳转,包括页间跳转和页内跳转。链接的是URL地址
* target属性指定打开目标页面的方式,其取值包括:
_blank:在新的页面中打开。
_self:在当前页面中打开。默认
_parent:这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中,那么它与目标 _self 等效。跨域问题
_top:这个目标使得文档载入包含这个超链接的窗口,用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口
* title 属性指定提示信息。
例:<a href="http://www.baidu.com/" target="_blank" title="点击可以去搜索">百度一下,你就知道</a>
2.3.1
页内跳转
在目标标签处指定id=””,在链接出指定href=”#”
* id属性是页面元素的唯一标识。
* name跳转只能用<a>标签
2.4图片标签<img>
* src:source,图片的URL 地址,可以是本地的,也可以是别的地方的地址。<imgsrc="img1.jpg">
* alt(altemative,可供替代的),当资源不存在时,可以替代显示文字内容。
路径:
绝对路径,通俗就是在哪里都可以找到的。
相对路径,
“../+”表示上一级目录 <img src="../img2.jpg">
“./”表示当前目录
“文件夹名/”表示下一级目录<img src="pic/img4.jpg" alt="资源不存在">
别的路径,<imgsrc="../chapter1/pic/img3.jpg" alt="资源不存在">
2.5
杂项
<span>:可以将部分文本独立出来。可以参考E101-02-06笔记
<br>:强制换行
<hr>:一条横线
<base>:标签规定页面中所有链接的基准 ,简化地址的书写。
<img
src="http://www.runoob.com/images/logo.png"alt="图片资源不存在"/>
<br>
<base
href="http://www.runoob.com/images/">
<img
src="logo.png"
alt="图片资源不存在"/>
2017.7.6周四