HTML5 初步了解
这是HTM5L的第一篇博客.
那么就让我们简单的了解HTML5的语法吧.
(HTML5运行环境要求极低,非关键地方就不做截图了)
<!--根标签-->
<html>
<!--头部标签-->
<!--
src和href的区别
src:引用,该资源是页面不可缺少的一部分,如(img标签 video标签 radio标签);
href:引入,引入外部资源,如(a标签 link标签)
-->
<head>
<meta charset="UTF-8">
<title>第一个程序</title>
</head>
<!--身体标签-->
<body>
你好,世界!
</body>
</html>
上面的代码是最最简单的代码
下面是一些常用标签
<!--根标签-->
<html>
<!--头部标签-->
<head>
<meta charset="UTF-8">
<title></title>
</head>
<!--身体标签-->
<body>
<!--标题标签-->
<h1>旭宝爱吃鱼</h1>
<h2>旭宝爱吃鱼</h2>
<h3>旭宝爱吃鱼</h3>
<h4>旭宝爱吃鱼</h4>
<h5>旭宝爱吃鱼</h5>
<h6>旭宝爱吃鱼</h6> <div>旭宝爱吃鱼</div>
<div>旭宝爱吃鱼</div>
<div>旭宝爱吃鱼</div>
<div>旭宝爱吃鱼</div> <!--段落标签-->
<p>旭宝爱吃鱼</p>
<p>旭宝爱吃鱼</p>
<p>旭宝爱吃鱼</p>
<!--输入框标签-->
<input><br>
<input placeholder="请输入用户名"><br><br><br>
<input value="旭宝爱吃鱼"><br>
<input type="color"><br>
<input type="checkbox"><br>
<input type="date"><br>
<input type="range"><br>
<!--换行标签-->
<br>
<!--超链接标签-->
<a href="http://baidu.com" target="_blank">百度一下,你就不知道</a>
<!--图像标签
相对路径 项目中的资源
绝对路径 http:// https:// ftp:// file://
-->
<img src="https://www.baidu.com/img/bd_logo1.png" width="150" height="150"> <!--列表标签-->
<ul>
<li>旭宝爱吃鱼->1</li>
<li>旭宝爱吃鱼->2</li>
<li>旭宝爱吃鱼->3</li>
<li>旭宝爱吃鱼->4</li>
</ul>
<!--容器标签-->
<div>旭宝爱吃鱼</div> </body>
</html>
HTML5 初步了解的更多相关文章
- HTML5初步——新的表单元素和属性
HTML5初步--新的表单元素和属性 HTML5初步--新的表单元素和属性 <!DOCTYPE html> <html> <head> <meta chars ...
- HTML5初步了解
一.使用HTML5的十大原因 你难道还没有考虑使用HTML5? 当然我猜想你可能有自己的原因:它现在还没有被广泛的支持,在IE中不好使,或者你就是喜欢写比较严格的XHTML代码.HTML5是w ...
- 对HTML5的初步认识(一)
一.概述 1.HTML5是什么? HTML5是最新一代的HTML标准,它不仅拥有HTML中所有的特性,而且增加了许多实用的特性,如视频.音频.画布(canvas)等. 2012年12月17日,万维网联 ...
- 学习前端第二天心得体会(初步了解HTML5的部分API以及画布Canvas)
一.HTML5部分API 1.选择器querySelector和querySelectorAll 1.1.querySelector:返回文档中匹配指定的CSS选择器的第一元素. document. ...
- 学习前端第一天心得体会(初步了解HTML5的新特性以及和HTML的区别)
一.HTML5是什么? HTML5 是最新的 HTML 标准. HTML5 是专门为承载丰富的 web 内容而设计的,并且无需额外插件. HTML5 拥有新的语义.图形以及多媒体元素. HTML5 提 ...
- html5引擎开发 -- 引擎消息中心和有限状态机 - 初步整理 一
一 什么是有限状态机 FSM (finite-state machine),又称有限状态自动机,简称状态机,是表示有限个状态以及在这些状态之间的转移和动作等行为的数学模型.他对于逻辑以及 ...
- 移动端之Android开发的几种方式的初步体验
目前越来越多的移动端混合开发方式,下面列举的大多数我都略微的尝试过,就初步的认识写个简单的心得: 开发方式 开发环境 是否需要AndroidSDK 支持跨平台 开发语言&技能 MUI Win+ ...
- [入门级] 基于 visual studio 2010 mvc4 的图书管理系统开发初步 (二)
[入门级] 基于 visual studio 2010 mvc4 的图书管理系统开发初步 (二) Date 周六 10 一月 2015 By 钟谢伟 Category website develop ...
- 基于 HTML5 的 Web SCADA 报表
背景 最近在一个 SCADA 项目中遇到了在 Web 页面中展示设备报表的需求.一个完整的报表,一般包含了筛选操作区.表格.Chart.展板等多种元素,而其中的数据表格是最常用的控件.在以往的工业项目 ...
随机推荐
- sticky组件的改进实现
上上篇博客介绍了一个sticky组件的简洁实现,经过这两天的思考,发现上次提供的实现还有较多不足的地方,另外跟别的网站上实现的效果在取消固定的时候也有一些不同,上次提供的取消固定的处理方式不好,本文在 ...
- Auto Mapper03
经过上一篇博客的学习,大体了解了Auto Mapper的运行机制和操作流程.我们下来学习下,AutoMapper里面具体的一些东西. 一:规则 当我们使用AutoMapper创建实体和 ...
- 根据日期查询access数据库
获取指定日期的记录 1.select Field1 from A where format("yyyy-MM-dd",Field1)=#2011-10-07# 有时不能获取记录 ...
- [前端]使用JQuery UI Layout Plug-in布局 - wolfy
引言 使用JQuery UI Layout Plug-in布局框架实现快速布局,用起来还是挺方便的,稍微研究了一下,就能上手,关于该布局框架的材料,网上也挺多的.在项目中也使用到了,不过那是前端的工作 ...
- LeetCode4:Add Two Numbers
题目: You are given two linked lists representing two non-negative numbers. The digits are stored in r ...
- Firemonkey 移动平台 Form 显示使用 ShowModal 范例
procedure TForm1.Button1Click(Sender: TObject); begin Form2 := TForm2.Create(Self); Form2.ShowModal( ...
- java.lang.IllegalStateException: Recursive entry to executePendingTransactions
[解决办法]: 将getFragmentManager改为getChildFragmentManager即可
- Training - Problem and Change Management
Problem Management Problem management seeks to identify the underlying causes of incidents in an IT ...
- WPF如何实现一款类似360安全卫士界面的程序?(共享源码!)
以前学习Windows Form编程的时候,总感觉自己做的界面很丑,看到360安全卫士.迅雷等软件的UI设计都非常美观,心里总是憧憬着要是自己能实现这样的UI效果该多好!!!另一个困扰我的问题是,这个 ...
- 15款加速 Web 开发的 JavaScript 框架
JavaScript 可以通过多种方式来创建交互式的网站和 Web 应用程序.利用 JavaScript,可以让你移动 HTML 元素,创建各种各样的自定义动画,给你的访问者更好的终端用户体验. 对于 ...