Html5元素及基本语法详解


Posted in HTML / CSS onAugust 02, 2016

HTML标签
开始标签(opening tag):开放标签
结束标签(closing tag):闭合标签

元素
定义:HTML元素指的是从开始标签到结束标签的代码(元素以开始标签为起始以借宿标签终止)
元素的内容:元素的内容指的是开始标签与结束标签之间的内容

元素的特点:
1,大多数HTML元素可嵌套(可以包括其他的HTML元素)
2,HTML文档有嵌套的HTML元素构成
3,不要忘记结束标签,未来的HTML版本不允许省略结束标签
4,空的html元素
5,没有内容的html元素被称为元素的空内容,空元素是在开始标签中关闭的
注意:
空元素和空内容的区别:空元素的开始标签和结束标签是相同的,注重的是标签。空内容指的是元素内的内容是空的,注重的是内容。

HTML基本结构
<!doctype html>:不是标签,只是用以声明帮助浏览器正确地现实网页
<head></head>元素是所有头部元素的容器
<meta>标签始终位于head元素中,标签提供关于HTML文档的元数据
<style>标签用于为HTML文档定义样式信息
<title></title>定义文档的标题
<body></body>之间的文本是网页课件的内容
<html></html>之间的文本描述网页

HTML属性
html标签可以拥有属性,属性提供有关html元素的更多信息
属性总是以名称/值对的形式出现
属性值应该始终被包括在括号内,双引号是最常见的,不过使用单引号也没有问题

 

Html5元素及基本语法详解

 

 HTML注释
可以在代码中插入注释,提高代码的可读性,注释不会显示在页面中,浏览器会忽略它们
格式:<!--this is a comment-->

XML/HTML Code复制内容到剪贴板
  1. <!doctype html>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8">  
  5. <title>无标题文档</title>  
  6. <style>  
  7.   
  8. #box1{   
  9.     background-color:red;   
  10. }   
  11. .div1{background:yellow;}   
  12. .div2{border:1px solid #000;}   
  13.   
  14. </style>  
  15. </head>  
  16.   
  17. <body>  
  18.   
  19. <!-- id只能是唯一的 -->  
  20. <div style="width:100px; height:100px; border:1px solid #000;" id="box1 box2"></div>  
  21.     
  22.   
  23. <!--class可以是多个的-->  
  24. <div  style="width:100px; height:100px;"  class="div1 div2" ></div>  
  25.   
  26. <!--class可以是多个的-->  
  27.   
  28. <a href="#" title="我是一个提示信息">我是一个链接</a>  
  29.   
  30. </body>  
  31. </html>  

以上这篇Html5元素及基本语法详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

原文地址:http://www.cnblogs.com/Sivan/archive/2016/08/01/5727083.html

HTML / CSS 相关文章推荐
纯CSS3实现绘制各种图形实现代码详细整理
Dec 26 HTML / CSS
绝对令人的惊叹的CSS3折叠效果(3D效果)整理
Dec 30 HTML / CSS
CSS3之背景尺寸Background-size使用介绍
Oct 14 HTML / CSS
一款纯css3制作的2015年元旦雪人动画特效教程
Dec 29 HTML / CSS
老生常谈CSS中的长度单位
Jun 27 HTML / CSS
CSS3 实现图形下落动画效果
Nov 13 HTML / CSS
HTML5 Canvas——用路径描画线条实例介绍
Jun 09 HTML / CSS
html5 canvas绘制矩形和圆形的实例代码
Jun 16 HTML / CSS
基于HTML5陀螺仪实现ofo首页眼睛移动效果的示例
Jul 31 HTML / CSS
使用html2canvas.js实现页面截图并显示或上传的示例代码
Dec 18 HTML / CSS
CSS3 天气图标动画效果
Apr 06 HTML / CSS
CSS中使用grid布局实现一套模板多种布局
Jul 15 HTML / CSS
Html5 web本地存储实例详解
Jul 28 #HTML / CSS
浅谈Html5中视频 音频标签 进度条的问题
Jul 26 #HTML / CSS
html5 初试 indexedDB(推荐)
Jul 21 #HTML / CSS
浅谈HTML5 &amp; CSS3的新交互特性
Jul 19 #HTML / CSS
HTML5和CSS3实例教程总结(推荐)
Jul 18 #HTML / CSS
HTML5 拖放功能实现代码
Jul 14 #HTML / CSS
HTML块级标签汇总(小篇)
Jul 13 #HTML / CSS
You might like
Php部分常见问题总结
2006/10/09 PHP
php 无限级缓存的类的扩展
2009/03/16 PHP
php入门学习知识点二 PHP简单的分页过程与原理
2011/07/14 PHP
php引用传值实例详解学习
2013/11/06 PHP
ThinkPHP的Widget扩展实例
2014/06/19 PHP
使用图灵api创建微信聊天机器人
2015/07/23 PHP
ThinkPHP下表单令牌错误与解决方法分析
2017/05/20 PHP
Js的MessageBox
2006/12/03 Javascript
JavaScript 构造函数 面相对象学习必备知识
2010/06/09 Javascript
ejs v9 javascript模板系统
2012/03/21 Javascript
JavaScript 基础篇之运算符、语句(二)
2012/04/07 Javascript
input标签内容改变的触发事件介绍
2014/06/18 Javascript
基于NodeJS的前后端分离的思考与实践(五)多终端适配
2014/09/26 NodeJs
通过JS判断联网类型和连接状态的实现代码
2015/04/01 Javascript
nodejs实现HTTPS发起POST请求
2015/04/23 NodeJs
下一代Bootstrap的5个特点 超酷炫!
2016/06/17 Javascript
利用JS判断客户端类型你应该知道的四种方法
2017/12/22 Javascript
Vue移动端项目实现使用手机预览调试操作
2020/07/18 Javascript
通过Python来使用七牛云存储的方法详解
2015/08/07 Python
实例讲解Python中SocketServer模块处理网络请求的用法
2016/06/28 Python
简单谈谈Python中的元祖(Tuple)和字典(Dict)
2017/04/21 Python
Python简单实现阿拉伯数字和罗马数字的互相转换功能示例
2018/04/17 Python
Python解决走迷宫问题算法示例
2018/07/27 Python
使用python将时间转换为指定的格式方法
2018/11/12 Python
利用python和ffmpeg 批量将其他图片转换为.yuv格式的方法
2019/01/08 Python
Python实现的合并两个有序数组算法示例
2019/03/04 Python
Python 脚本实现淘宝准点秒杀功能
2019/11/13 Python
使用pyshp包进行shapefile文件修改的例子
2019/12/06 Python
澳大利亚领先的孕妇服装品牌:Mamaway
2018/08/14 全球购物
美国礼品卡交易网站:Cardpool
2018/08/27 全球购物
娇韵诗法国官网:Clarins法国
2019/01/29 全球购物
党的群众路线教育实践活动心得体会(乡镇)
2014/11/03 职场文书
2014年技术员工作总结
2014/11/18 职场文书
答辩状格式范本
2015/05/22 职场文书
用Python将GIF动图分解成多张静态图片
2021/06/11 Python
MySQL数据库简介与基本操作
2022/05/30 MySQL