初识前端HTML
HTML 超文本标记语言
HTML的解析
顾名思义，HTML就是由一个个的标签组成的，组成后，HTML可被浏览器直接识别以及处理成我们想给用户展示的样子。
下面我们就来解析HTML的一个个标签。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>博客链接</title>
</head>
<body>
<h2>请点击下面的链接通往kerwin的博客</h2>
<a href ="http://www.cnblogs.com/kerwinC/" target="_blank">kerwin >的博客</a>
<p>kerwin的博客是kerwin先生自己的博客<br />博客内容非常丰富。</p>
<span>版权所有</span>
<span>kerwin</span>
</body>
</html>
在这个例子中 <header></header> 是这个页面的大脑部分<body></body> 是这个页面的身体部分，而<html></html>，则就是这一整个人了。
HTML的标签，就像是填充这个身体的器官，共同构成了一个完整的人。
HTML的标签分类
标签分为主动闭合和被动闭合标签。
还分为行内标签以及块标签
主动闭合
< meta charset="UTF=8">
meta标签是一个典型的主动闭合标签，它可以提供有关页面的元信息，比如针对搜索引擎和更新频度的描述和关键词。
<div></div>
div标签，一个强大的被动闭合标签，同时也是个行级标签。
<span></span>
span标签，一个被动闭合标签，同时也是个块级标签。
块级标签和行内标签的对比如下图：
html中的特殊字符
太多了，请自行查看：
http://www.jb51.net/onlineread/htmlchar.htm
meta标签的妙用
此标签在head标签内使用
<meta charset="UTF-8"> 设置页面的字符集
<meta http-equiv="refresh" content="3"> #设置页面三秒刷新一次
<meta http-equiv="refresh" content="3;Url=http://www.baidu.com"> #设置三秒刷新后，调转到百度。<meta name="keywords" content="商城"> #给搜索引擎抓取
<meta name="description" content="网购来这里"> #给搜索引擎抓取
title标签
此标签在head标签内使用
<title>商城</title> #显示在
这里
link标签
此标签在head标签内使用
<link rel="shortcut icon" herf="image/favicon.ico">
此标签就是title内容旁边的那个小图。
style标签
此标签在head标签内使用
script标签
此标签在head标签内使用
a标签
<a href="http://www.cnblogs.com/kerwinC"></a>
a标签可以做点击跳转
P标签
<p>2016年美国总统大选投票计票于当地时间11月8日正式进行。<br />据美国福克斯新闻网11月9日最新消息，特朗普283:254领先希拉里，已确认赢得大选。<br />支持者欢呼。</p>
p标签可以做段落，段落与段落之间是有空间的，段落内换行的话加入<br />即可。
h标签
<h1></h1>
......
<h6></h6>
h标签可作为标题，大小由大（h1）到小（h6）
span标签
span标签是一个行内标签，它里面的内容不会占具超过自己字符的空间。
<span>hello</span>
初识前端HTML的更多相关文章
- 20初识前端HTML（1）
1 .HTML 1.1 网页的组成 文字 图片 链接 等元素构成.除了这些元素之外 网页中还可以包含音频 视频 等 1.2 WEB前端开发的流程 现在主流的开发流程: 前后端分离的开发模式. 美工:p ...
- web标准 浏览器介绍 开发工具介绍 HTML介绍 HTML颜色介绍 规范 HTML结构详解 {前端之前端初识}
前端之前端初识 前端初识 本节目录 一 web标准 二 浏览器介绍 三 开发工具介绍 四 HTML介绍 五 HTML颜色介绍 六 规范 七 HTML结构详解 一 web标准 web准备介绍: 1. ...
- day 41 前端之前端初识
前端之前端初识 前端初识 本节目录 一 web标准 二 浏览器介绍 三 开发工具介绍 四 HTML介绍 五 HTML颜色介绍 六 规范 七 HTML结构详解 一 web标准 web准备介绍: 1. ...
- 01 . 前端之HTML
初识前端 HTML简介历史 HTML(Hyper Text Markup Language)超文本标记语言,它不同于编程语言 超文本就是超过纯文本的范畴,例如描述文本的颜色.大小.字体等信息,或使用图 ...
- 写给自己的web总结——关于html的知识总结
相信每个前端工程师初识前端之时,最先接触的都是html吧! html的全称是hyperText markup language, 超文本标记语言,在网页中所有的文字,图片,架构等都是由html来编写的 ...
- webpack之loader实践
初识前端模板概念的开发者,通常都使用过underscore的template方法,非常简单好用,支持赋值,条件判断,循环等,基本可以满足我们的需求. 在使用Webpack搭建开发环境的时候,如果要使用 ...
- 适合 JS 新手学习的开源项目——在 GitHub 学编程
作者:HelloGitHub-小鱼干 这里是 HelloGitHub 的<GitHub 上适合新手的开源项目>系列的最后一篇,系列文章: C++ 篇 Python 篇 Go 篇 Java ...
- 前端组件化Polymer入门教程(1)——初识&&安装
前端组件化Polymer入门教程目录: 前端组件化Polymer入门教程(1)--初识&&安装 前端组件化Polymer入门教程(2)--快速入门 前端组件化Polymer入门教程(3 ...
- 装饰器的初识,基于bootstrap的前端开发
1装饰器的初识 概念:不改变函数原来的调用方式,动态地给函数添加功能 开放封闭的原则:1>对添加的新功能是开放的,32>不要在元代码进行修改(封闭) 1.1>函数的定义:对代码块和功 ...
随机推荐
- [ES6] Promise
How to use: export default function getReplies(topicId){ return new Promise(function( resolve, rejec ...
- Java和C#中String直接赋值与使用new创建（==与equals进行比较）的区别
在Java中,字符串可以直接赋值或者使用new来新建,直接赋值的话是编译阶段(.class文件)中就将该字符串值放到常量池中,以后如果有其他变量直接赋予同样的值的话就不再分配内存空间,而是直接给它个引 ...
- ssh远程登录linux live系统
要想ssh远程登录,须要准备两件事:配置同网段IP和开启SSH服务. 因为live系统没有IP,所以首先须要配置IP. 我的live系统是在虚拟机上启动的,宿主IP为192.168.230.1,liv ...
- pd的django个人博客教程----1：效果展示等
开发环境同to do list 1:首页:localhost/pd/ 2:导航栏测试或者生活点入: 测试:localhost/category/?cid=1 3:点击文章后进入文章显示页面 e.g:进 ...
- WCF 客户端与服务端消息传输
WCF很多需要认证信息,保证服务的安全,可以使用消息来实现 WCF 实现消息的方式: WCF中有两个接口: IClientMessageInspector [定义一个消息检查器对象,该对象可以添加到 ...
- 打印对象和toString方法
JAVA对象 java对象是都是Object类的实例,都可直接调用该类中定义的方法,这些方法提供了处理java对象的通用方法. > > 6.2.1打印对象和toString方法 先看 ...
- Redhat修改本地yum源
1.将Centos系统的ios文件传到服务器,比如传到/root目录下: 2.将ios文件挂载到本地,需要在本地建立一个文件夹,比如/yum; mkdir /yum mount -o loop /ro ...
- O、Ω、Θ表示
转载,原网址为:http://book.2cto.com/201211/8127.html 对于任何数学函数,这三个记号可以用来度量其“渐近表现”,即当趋于无穷大时的阶的情况,这是算法分析中非常重要的 ...
- mysql数据修改-DEDE
update `dede_arctype` set `templist`='{style}/products.htm' where `templist`='{style}/Product.htm' d ...
- IIC 概述之用IO模拟
最近做的一个项目,是基于IIC总线通信的传感器系统.由于另外一个传感器使用的是类IIC协议,而不是标准IIC,所以MCU不能与其通信,最后没有办法,只有通过I/O口模拟的方式实现IIC的总线通信.具体 ...