我的学习成果

HTML笔记

HTML的基础知识:... 1

1.1什么是计算机语言?... 1

1.2 什么是标记语言... 2

基础标签... 4

2.1 标题标签... 4

2.2段落标签... 4

2.3链接标签... 5

2.4图片标签(img)... 6

2.5杂项... 6

 

HTML的基础知识

1.1什么是计算机语言?

人与人之间是通过语言进行交流,那么人和计算机之间如何交流呢?计算机只知道“0”和“1”,所以我们就通过“0”和“1”这种语系来和计算机交流,这就是机器语言。在其中用电压高低来表示“0”和“1”。

机器语言:对于人类讲太难理解,编制程序太困难。为了解决这个问题,我们将一串特定的“01”进行符号化,这就是汇编语言。比如:ADD3,6

机器语言和汇编语言都是属于低级语言,即体现了机器的特性,而对于大多数不是计算机工程师的人来说,还是太困难了。

高级语言:用类似英语加数学的符号来描述,最大程度屏蔽了机器特性,使得程序的阅读和编制变得越来越容易。

如:if(a>b){

c = a;

}else{

c = b;

}

常见的高级语言:C、C++、C#、Java

1.2 什么是标记语言

①什么是文本文件?

只有文本内容,没有任何的格式。举例:在记事本中输入“带你出师,闯荡江湖!”,并设置相应的格式,但是在其他电脑上打开并没有显示相同的格式,说明其中不包含任何格式信息查看文件大小显示20字节。

在word中输入同样的语句,同时设置格式,在另一台电脑上会显示同样的内容和格式。

说明Word文档中除了存储内容,还存储了格式等信息(document.xml) ml就是标记语言(Markup Languaage)的缩写,我们要学的HTML(Hyper Text Markup Languaage)也是一种标记语言(是一种超文本的标记型的语言)

②超文本:不仅仅能表示文本信息,还能表示音视频、格式等等信息。

浏览网页实际上就是将存储在服务器上的HTML文件下载到本地,然后通过浏览器(IE、Chrome等)进行解析并呈现内容。

HTML基本结构

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd"
>
<html>
<!-- head部分主要做一些设置工作,比如字符集、标题等-->
<head>
    <meta http-equiv="Content-Type"content="text/html;charset=gb2313">
    <title>第二个演示网页</title>
</head>
<!--文档的主体部分,呈现给用户的信息都在这里-->
<body>
    带你出师,闯荡江湖!
</body>
</html>

<html>:是整个文档的根节点,它包含两个子节点;

<head>:主要描述文档的设置信息,比如:字符集、标题等;

<body>:是文档的主体部分,需要呈现的内容都安排在其中。

注释的作用:

①   快捷键:Ctrl+Shift+/

②   形式:<!-- -->

③   作用:对代码进行说明,方便程序员阅读和理解。注释对计算机的执行结果没有任何影响。

注释非常重要,代码正确是前提,但清晰也是一个非常重要的原则,要养成写注释的习惯。

 

 

基础标签

2.1 标题标签

<标签名></标签名>

标题标签用于显示页面的标题信息既包含了格式信息,同时提供了语义信息

<h1>-<h6>(从大到小)

<!--标题标签演示-->
这是没使用标签的标题
<h1>这是使用h1标签的标题</h1>
<h2>这是使用h2标签的标题</h2>
 

2.2段落标签

段落(paragraph)标签标示页面的一个段落。

<!--段落标签演示-->
<h2>登鹳雀楼</h2>
<h3>白日依山尽;</h3>
<h3>黄河入海流;</h3>
<h3>欲穷千里目;</h3>
<h3>更上一城楼。</h3>

 

2.3链接标签

链接标签<a>的作用的跳转,包括页面跳转和页内跳转

href属性制定链接的目标URL地址

(1)   页间跳转

<!--链接标签跳转的演示-->
<a href="http://www.runoob.com" target="_blank" title="努力成功">菜鸟网</a>

 

target属性指定打开目标页面的方式,其取值包括,

_self在当前页面打开,默认

_blank在新的页面中打开

_parent

_top

title属性指定提示信息

(2)页内跳转

在需要跳转的目标标签处指定id=”......”,在链接出指定href=”#......”

id属性是页面元素的唯一标识

“锚点”:anchors

2.4图片标签(img)

在网页中嵌入图片

srcsource,图片资源的URL地址,可以是本地的,也可以是远程的,

<img src="可爱.jpg" width="1200" height="750">

②alt属性:altemative可替代的),即当资源不存在时,替代显示的文字内容

③ 路径:

相对路径

绝对路径

../”:表示上一层目录、“./”:表示当前目录

在同一级目录:<img src="可爱.jpg">

在上一级目录:<img src="../可爱.jpg">

在下一级目录:<img src="pic/可爱.jpg">

不在同一文件下:imgsrc="../chapter1/pic/可爱.jpg">

2.5杂项

<span>:可以将部分文本独立出来;

<br>:换行;

<hr>:可以加横线分隔上下内容;

<base>:用来指定该页面的绝对路径。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值