初识HTML5(一)

初识html4


计算机语言

第一次h5的课,老师讲了这个计算机语言由简单的2进制到汇编再到现在的高级语言。包括C 、 C++、 PHP、 Java、 C#等 那我们现在使用的编程语言基本上都是基于JavaScript,Js 和Java 的关系就像是之前所说的老婆和老婆饼的关系。那就是没有任何关系。

标记语言

.html文件是纯文本文件,什么叫纯文本就是不存储任何格式,只有内容。把同样的内容放在txt html 和word文档中调整格式,然后观察他的文件大小明显word文档要大,就是因为这个word文档中存储了格式和内容。
存储到txt文档中
存储到word文档中
html就是 Hyper Text Marked Language 标记语言。
.html又是超文本,就是说它不仅仅能存储文本信息,还能存储音频,视频。

## 浏览网页的实质 ##
将服务器上的文件下载到本地,然后通过浏览器进行解析并分析内容。那么下载到本地的哪里呢
一般情况的路径为

C:\Users\Administrator\AppData\Local\Microsoft\Windows\Temporary Internet Files
//c盘中的users 中的用户下面的文件

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=utf-8" />
    <!-- 网页内容类型的声明,让浏览器来识别网页的内容-->
    <title>我的第一个网页</title>
</head>
<!--文档的主体部分,呈现给用户的信息都在此-->
<body>
带你出师,闯荡江湖!
</body>
</html>
<!-- 
<html>整个文档的根节点
<head>主要描述文档的设置信息,比如说字符集和标题
    <meta>设置字符集
    <tittle>设置标题
<body>文档的主题内容,需要在网页上呈现的内容都安排在其中
注释:快捷键 ctrl + / 或者 ctrl + shift + /
形势就是"<!-- - ->"
作用:对代码进行说明,方便程序员阅读和理解。注释对于计算机的执行结果没有任何影响
他的作用非常重要,代码正确是前提,清晰也是非常重要的,程序员要养成写注释的习惯。
注释一般用于对一个函数或者一段代码的说明方便以后阅读,有一些变量的定义。之后会在总结
-->

基础标签


  • 标题标签:

    标题标签用于一段文字的标题说明,他的语义就是标题。用法

    <h1>一级标题</h1>
    <h2>二级标题</h2>
    <h3>三级标题</h3>
    <h4>四级标题</h4>
    <h5>五级标题</h5>
    <h6>六级标题</h6>
  • 段落标签
    段落标签显示一个段落自动换行
    <h3>登鹳雀楼</h3>
    <p>白日依山尽,</p>
    <p>黄河入海流。</p>
    <p>欲穷千里目,</p>
    <p>更上一城楼。</p>
  • 链接标签(a标签) a是anchor的缩写
    a标签的作用就是跳转,包括页面的跳转和页内跳转。
<a href="http://www.huadianedu.com" title="百度" target="_blank">华点</a>

1._blank
浏览器会另开一个新窗口显示document.html文档
2._parent
指向父frameset文档
3._self
把文档调入当前页框
4._top
去掉所有页框并用document.html取代frameset文档
tittle属性指明连接的信息

页面内的跳转
在目标标签处指明id=”“, 连接处指定 href=”#id值” 然后点击会跳转到相应的id位置

<a href="#zhangjie3" title="章节3" target="_blank">章节三</a>
  • 图片标签
     <img src="logo.jpg" alt="logo" title="图片" />

属性:
src 为图片的地址,也就是路径。有两种格式

  (1). 绝对路径 : 图片保存的地址
  (2). 相对路径 : 相对于本文档的路径。上一层用../                                                 `<img src="../chapter4/logo.jpg" alt="logo" title="图片" />`

alt为 资源缺失时显示的内容。其原有的英文单词为alternative
title 为鼠标停留在图片上显示的内容

杂项

  1. <span>可以将文本独立出来代码如下 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>杂项</title>
    <style>
    span {
    font-size: 30px;
    }
    </style>
    </head>
    <body>
    <p>这是<span>一个</span>段落</p>
    </body>
    <!--这样一个的字体就是30px其余的都是默认的字体-->
    </html>
  2. <hr> 绘制横线
    <h1>华点软件学院</h1>
    <hr/>
  1. <base>
    base标签用于头元素内部。
    他的作用是改变网页所有的默认地址。
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值