H5入门——HTML部分

一.HTML的基本构成

1.<!DOCTYPE html>文档类型声明

    <!--HTML的文档类型声明。声明这个文件是HTML5文件,让浏览器按照HTML5准备进行解析显示。文档类型声明在HTML文件中,必须要有,而且必须写在文件最上方。如果不写文档类型声明,浏览器会默认按照兼容模式运行,可能会出现不明bug。-->

<!--注释:文档类型声明是写给程序员看的,网页中不会显示。html中的注释快捷键:Ctrl+/ -->

2.<head></head>部分

head作用:

用于描述网页的一些关键信息。比如网页的配置,设置,关键字等等……这些信息,大多在浏览器看不到,但是对网页的解析至关重要!

(1) meta标签,用于描述网页的各种信息

其中<mete chaset="utf-8"/> 设置网页的编码格式为UTF-8。

【设置网页的字符集编码格式:】

GB2312:简体中文的编码格式。

GBK:扩展的国标码。比国标码多了更多的编码格式。

utf-8:万国码。可以兼容绝大多数国家的语言。

[了解]:

HTML4.01之前,声明字符集编码的格式:

<meta http-equiv="Content-type" content="text/html; charset=utf-8" />

代码示例:

<meta charset="utf-8" />

(2)设置网页的关键字,有助于搜索引擎的搜索。

name="keywords"表示这个mete标签设置的是网页的关键字;

content=""表示关键字的详细信息,多个关键字,用英文逗号分隔;

代码示例:

<meta name="keywords" content="H5网页开发"/>

(3)设置网页的描述信息,搜索引擎搜索时,标题下面的一段文字!非常重要!

name="description"表示这个mete标签设置的是网页的描述信息;

contet=""表示描述信息的详细内容!!!

代码示例:

<meta name="description" content="这是我在杰瑞教育开发的第一个网页!"

<!--title:网页的标题,显示在浏览器选项卡上面的文字-->

代码示例:

<title>这是我的第一个网页!!</title>

<link>标签link链接网页的小图标:网页选项卡上的小图片

①rel="icon"表示当前link的作用,是链接网页图标;

②href=""表示图片地址

<link/>自闭合标签,也叫空标签。

代码示例:

<link rel="icon" href="img/QQ.jpg" />

3.<body></body>部分

时间: 2024-10-12 16:54:38

H5入门——HTML部分的相关文章

H5入门

1.基本骨架 <!DOCTYPE html> <html> <head><title>标题</title><meta charset="UTF-8"><link rel="icon" href="路径"/>(link自闭合)</head> <body></body> </html> 规范:标签要用<>括起

H5-新手入门1

引言:对于一个计算机相关专业的,又一直对编程不太感冒的女生来说,h5是一门比较好上手的语言,适合女生,也适合还想在编程路上走一走的人.    先贴几张我目前用h5做的东西,后面会给代码(学习过程会一直记录,本文为第一篇) 接下来开始介绍H5入门该掌握的基础内容 一.html的基本结构 html主要包括head和body两个部分,网页中的几乎所有内容都在body中,然后这些内容是怎样布局的都是由head中的内容决定的. 二.head中的标签及其属性 head常用标签主要有三个:title, met

个人前端学习总结(纯小白和新手及初级向)

前言   虽然进入前端这个行业时间不长,但也不再是纯小白了(技术依然菜鸡,路漫漫其修远兮) 写这篇文章的初衷是因为身边偶尔会有朋友跟我说对前端感兴趣,想要入坑,怎样入门等等... 一般我会问一个问题,你为什么入坑?因为工资高?福利待遇好?别人都说好?还是自己感兴趣? 这个问题很重要,如果你对这个行业只是因为工资高,福利待遇好,而不是因为对其有兴趣, 那么当你真正进入这一行遇到困难和瓶颈时,会更加忧虑和痛苦,甚至悔不当初. 关于前端入门,网上的资料,教程可谓是铺天盖地,琳琅满目.纯小白可谓是看得眼

“H5跨平台APP开发”APICloud从入门到精通

"H5跨平台APP开发"APICloud从入门到精通 课程学习地址:http://www.xuetuwuyou.com/course/164 课程出自学途无忧网:http://www.xuetuwuyou.com 课程介绍:               一.课程使用到的软件 APICloud Studuio(或Sublime.WebStorm加上APICloud插件) Google Chrome浏览器 海马玩手机模拟器(或真机) 二.课程目的:     随着IOS.Android等原生

移动H5开发入门知识,CSS的单位汇总与用法

说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid app的开发,都用到了css3技术,在css3中,新增了许多单位,rem.vw和vh.vmin和vmax.ch和ex等等,那现在对这些单位分别做一下详细的介绍吧. 1.em 做前端的应该对em不陌生,不是什么罕见的单位,是相对单位,参考物是父元素的font-size,具有继承的特点.如果字体大小是16

H5移动端开发入门知识以及CSS的单位汇总与用法

说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid app的开发,都用到了css3技术,在css3中,新增了许多单位,rem.vw和vh.vmin和vmax.ch和ex等等,那现在对这些单位分别做一下详细的介绍吧. 1.em 做前端的应该对em不陌生,不是什么罕见的单位,是相对单位, 这种技术需要一个参考点,一般都是以<body>的“font-siz

H5牌九源码架设小白入门教程

H5牌九源码架设小白入门教程http://diguaym.com/h5 有问题Q2152876294,官网下载[diguaym.com]很多刚刚接触到游戏开发,准备大展拳脚的小鲜肉们,往往在技术选型这第一关就栽了跟头.毕竟网络上的游戏引擎良莠不齐,官网上相关资料也比较少,而选择一个适合的游戏引擎是一个项目最基础,也是很核心的一部分.试想一下,在游戏开发进行到中后期的时候,才发现项目引入的游戏引擎与需求相悖,这时候不管是重新做一些修修补补的工作或者更换游戏引擎,这都是相当耗费人力物力的一件事.为了

CoreCLR源码探索(七) JIT的h5牛牛源码出售工作原理(入门篇)

很多C#的初学h5牛牛源码出售Q1446595067官网:h5.haozibbs.com者都会有这么一个疑问, .Net程序代码是如何被机器加载执行的? 最简单的解答是, C#会通过编译器(CodeDom, Roslyn)编译成IL代码, 然后CLR(.Net Framework, .Net Core, Mono)会把这些IL代码编译成目标机器的机器代码并执行. 相信大多数的C#的书籍都是这样一笔带过的. 这篇和下篇文章会深入讲解JIT的具体工作流程, 和前面的GC篇一样, 实现中的很多细节都是

【转帖】H5 手机 App 开发入门:概念篇

H5 手机 App 开发入门:概念篇 http://www.ruanyifeng.com/blog/2019/12/hybrid-app-concepts.html 作者: 阮一峰 日期: 2019年12月10日 感谢 腾讯课堂NEXT学院 赞助本站,腾讯官方的前端课程 免费试学. 手机现在是互联网的最大入口.根据<中国互联网报告>,手机网民已经超过8亿,人均每天上网三个多小时. 毫不奇怪,手机应用软件(mobile application,简称 mobile App)的开发工程师供不应求,一