HTML基础1--概述及简介

本文首发公众号: 伊洛的小屋,欢迎关注并查看更多内容!!!

HTMl简介
  • HTML(HyperText Markup Language) 不是一门编程语言,而是一种用来告知浏览器如何组织页面的标记语言
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <p>伊洛yiluo 微信搜索:伊洛的小屋</p>
</head>
<body>

</body>
</html>

HTML5文档省略了<html>, <head>,<body>等元素,使用HTML5DOCTYPE声明文档类型,简化<meta>元素的charset属性值,省略<p> 元素的结束标记,使用<元素/> 的方式结束<meta>元素,以及
元素等语法知识要点。

<!DOCTYPE html>
<meta charset="UTF-8">
<title>HTML5基本语法</title>
<h1>HTML5的目标</h1>
<p>HTML5的目的是为了能够创建更简单的WEB程序,书写出更简洁的HTML代码</p>
<br/> 例如,为了是web程序的开发变得更容易,提供了更多api,为了使得html变得更简洁,开发出了新属性,新的元素等,总体来说
为下一代的web 平台提供了许许多多的功能
  • HTML 标签不区分大小写
HTML包含
  • 开始标签
  • 结束标签
  • 内容
  • 元素
内容类型

html5的文件扩展名和内容类型保持不变。例如,扩展名仍然为'.html', '.htm'内容类型(ContentType)仍然为'text/html'

  • 文档类型
    DOCTYPE 命令声明文档类型,它是html文档必不可少的组成部分,且必须位于代码第一行。根据化繁为简的设计原则,html5对文档类型和字符说明都进行了简化
    在HTML5中,刻意不使用版本声明,一份文档将会适用于所有版本的HTML,在HTML5中,文档类型的声明方法如下
<!DOCTYPE html>

当使用工具时,也可以再DOCTYPE声明中加入SYSTEM识别符,声明方法如下

<!DOCTYPE HTML SYSTEM "about:legacy-compat">

在HTML5中,DOCTYPE声明方式是不区分大小写的,引号也不区分单引号还是双引号

  • 字符串编码
    在HTML5中,继续延用meta元素定义文档的字符编码,但是简化了charset属性的写法
<meta charset="UTF-8">
  • 标记省略
    在HTML5中,元素的标记可以省略。具体来说,元素的标记分为3种类型:不允许写结束标记,可以省略结束标记,开始标记和结束标记全部可以省略。
    不允许写结束标记的元素指,不允许使用开始标记与结束标记讲元素括起来的形式,只允许使用</元素>的形式进行书写
<br>错误</br>
</br> 正确
嵌套元素
  • 一个元素放到其它元素之中,这被称作嵌套
块级元素和内联元素
  • 块级元素在页面中以块的形式展现
  • 内联元素通常出现在块级元素中并环绕文档内容的一小部分,而不是一整个段落或者一组内容。内联元素不会导致文本换行
空元素
  • 不是所有元素都拥有开始标签,内容,结束标签。一些元素只有一个标签,通常用来在此元素所在位置插入/嵌入一些东西。例如:元素<img>
属性

属性包含:

  • 一个空格,在属性和元素名称之间
  • 属性名称,后面跟着一个等于号
  • 一个属性值,由一对引号“ ”引起来
    属性值两边既可以用双引号,也可以用单引号。HTML5在此基础做了一些改进,当属性值不包括字符串、<、>、=、单引号、双引号等字符时,属性值两边的引号可以省略
<input type="text">
<input type='text'>
<input type=text>
布尔属性

没有值的属性,被称为布尔属性,只能有跟它的属性名一样的属性值
对于具有boolean值的属性,例如disabled, readonly等,当只写属性而不指定属性时,表示属性值为true, 如果想要属性值设为false,可以不使用该属性。另外要想将属性设定为true,也可以将属性名设定为属性值,或将空字符串设定为属性值
实例

<!--只写属性,不写属性值,代表属性为true-->
<input type="checkbox" checked>
<!--不写属性,代表属性为false-->
<input type="checkbox">
<!--属性值=属性名,代表属性为true-->
<input type="checkbox" checked="checked">
<!--属性值=空字符串,代表为true-->
<input type="checkbox" checked="">

关注公众号获取更多内容

欢迎下方【戳一下】【点赞】
Author:伊洛Yiluo
愿你享受每一天,Just Enjoy !

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值