HTML5 骨架
html:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<title>HTML5 骨架</title>
<meta charset="UTF-8">
<!--[if it IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js">
</script>
<![endif]-->
<link rel="stylesheet" href="style.css">
</head>
<body>
<!-- HEADER -->
<header>
<h1></h1>
<p></p>
</header>
<!-- END HEADER -->
<!-- NAV -->
<nav>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</nav>
<!-- END NAV -->
<main>
<article>
<h1></h1>
<p></p>
</article>
</main>
<!-- FOOTER -->
<footer>
<p>©2014 W3Schools. All rights reserved.</p>
</footer>
<!-- END FOOTER -->
</body>
</html>
CSS样式表:
使用简单的语法链接样式表:
<link rel="stylesheet" href="style.css">
重置:
header, section, footer, aside, nav, main, article, figure {display: block;}
我常用的:
code
:Courier,
body{font-family:Courier, Verdana,Arial, Helvetica, sans-serif;}
短规则可以压缩,写在一行:
p.into {font-family: Verdana; font-size: 16em;}
body {
background-color: lightgrey;
font-family: "Arial Black", Helvetica, sans-serif;
font-size: 16em;
color: black;
}
在HTML中加载JavaScript:(使用简单的语法加载外部脚本):
<script src="myscript.js">
使用JavaScript访问HTML元素
使用“凌乱”的结果HTML样式,可能导致JavaScript错误。
这两个JavaScript语句将产生不同的结果:
var obj = getElementById("Demo")
var obj = getElementById("demo")
HTML5 骨架的更多相关文章
- html5 01
(1)Html 5的概念 能做什么? 为什么学习? HTML5并不仅仅只是做为HTML标记语言的一个最新版本,更重要的是它制定了Web应用开发的一系列标准,成为第一个将Web做为应用开发平台的HTML ...
- 前端笔记之HTML5&CSS3(中)选择器&伪类伪元素&CSS3效果&渐变背景&过渡
一.CSS3选择器 CSS3是CSS的第三代版本,新增了很多功能,例如:强大的选择器.盒模型.圆角.渐变.动画.2D/3D转换.文字特效等. CSS3和HTML5没有任何关系!HTML5骨架中,可以用 ...
- 前端笔记之HTML5&CSS3(上)新特性&音频视频&本地存储&自定义属性
一.HTML5简介 HTML 5 的第一份正式草案已于2008年1月22日公布.HTML5 仍处于完善之中.然而,大部分现代浏览器已经具备了某些 HTML5 支持. 2014年10月29日,万维网联盟 ...
- bootstrap基础模板页面,详细注释
<!--html5 骨架--> <!DOCTYPE html> <!--语言是中文简体--> <html lang="zh-cn"&g ...
- sublime的安装与使用
1.sublime简介 Sublime是一个代码编辑器,可以编写HTML,php,js,css等文件. Sublime是由程序员Jon Skinner于2008年1月份所开发出来,它最初被设计为一个具 ...
- HTML5入门(---------------HTML——基本骨架--------------)
HTML基础 一.HTML 超文本标记语言.英文全拼:HyperText Markup Language.负责网页的语义描述. 二.HTML基本骨架 <!DOCTYPE html> < ...
- html5 页面基本骨架
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- HTML5扩展之微数据与丰富网页摘要
一.微数据是? 一个页面的内容,例如人物.事件或评论不仅要给用户看,还要让机器可识别.而目前机器智能程度有限,要让其知会特定内容含义,我们需要使用规定的标签.属性名以及特定用法等.举个简单例子,我们使 ...
- Hyhyhy – 专业的 HTML5 演示文稿工具
Hyhyhy 是创建好看的 HTML5 演示文档的工具.它具备很多的特点:支持 Markdown,嵌套幻灯片,数学排版,兼容性,语法高亮,使用 Javascript API ,方便的骨架.它支持 Fi ...
随机推荐
- 十一、C# 泛型
为了促进代码重用,尤其是算法的重用,C#支持一个名为泛型的特性. 泛型与模块类相似. 泛型使算法和模式只需要实现一交.而不必为每个类型都实现一次.在实例化的时候,传入相应的数据类型便可. 注:可空值类 ...
- java基础易错点总结(一)
子类继承父类表示子类比他的父类包含更多的信息和方法 子类调用重载的构造方法时会调用父类的构造方法,super();一般如果不写的话会隐式的调用,而且每次调用都在所有语句之前. 在函数中,使用父类的地方 ...
- java_设计模式_观察者模式_Observer Pattern(2016-07-27)
看了好几篇文章,最终还是觉得<Head First 设计模式>举得例子比较符合观察者模式. 观察者模式概述: 观察者模式有时被称作发布/订阅模式,它定义了一种一对多的依赖关系,让多个观察者 ...
- 【POJ2155】【二维树状数组】Matrix
Description Given an N*N matrix A, whose elements are either 0 or 1. A[i, j] means the number in the ...
- iOS 对视频抽帧。
这里有两种方法可以采用, 方法一:使用MPMoviePlayerController MPMoviePlayerController *moviePlayer = [[MPMoviePlayerCon ...
- Mac开机黑屏解决办法
开机黑屏问题 *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !import ...
- zoj3839-Poker Face
#include<cstdio>int n;void P(int i,int j,int n,int f){ if(i==n){ for(int k=1;k<=n;k++)print ...
- Js冒泡事件和捕获事件
js中冒泡事件和捕获事件: 冒泡事件:冒泡事件是从里向外,即是从被绑定元素开始一直向外到达页面的所有祖先元素都会被触发,这 一过程被称为事件冒泡.这个事件从原始元素开始一直冒泡到DOM树的最上层 捕获 ...
- 项目任务管理(TaskMgr)设计篇
为什么使用void FilllXX(TypeA pParm1, TypeB pParm2) 应用场景色:void FillXX的好处是可以不用关心实例情况:如果在方法体中需要一个实例,而方法体只知道基 ...
- Ruby自学笔记(六)— 循环
循环结构在编程语言中是不可或缺的,所以Ruby中的循环也有其自定义的规则. 而我们关注循环结构,要知道两个因素:1) 循环的条件:2) 循环执行的内容 Ruby有一些方式来实现循环结构体: 1. ti ...