html_随笔
1 <h1> </h> 标题
2 <p> </p> 段落
3 <br /> 换行
4 <!-- ...--> 注释
5 <p style="..."> </p> 样式属性
6 <head><link rel = "stylesheet" type="text/css" href="mystyle.css"></head>外部样式表
6 name属性用于定义anchor，之后就能在html中直接使用这个anchor
7 <img src="url" /> 定义图片
8 <div> </div> 块容器
9 布局，来自w3cschool http://www.w3school.com.cn/html/html_layout.asp
10 <script> </script> 脚本
11 html头部元素 http://www.w3school.com.cn/html/html_head.asp
12 html5 语义新特性
html5可以将网页分块， 网页分块意味着将一个页面划分为几个独立的部分，包括内容、菜单、头部、底部、链接等， 这些只要使用一些新的标签。下面是一张html5概念图：
1、<header> 网站头部标签
2、<nav> 导航标签
3、<article> 内容标签
4、<section> 文章标签
5、<aside> 侧边栏
6、<footer> 网站底部标签
典型html5页面
典型html5页面：
<!DOCTYPE html>
<html lang="en">
<title>HTML5</title>
<meta charset="utf-8"> <!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js">
</script>
<![endif]--> <style>
body {
font-family:Verdana,sans-serif;font-size:0.8em;
}
header,footer,section,article {
border:1px solid grey;
margin:5px;margin-bottom:15px;padding:8px;
background-color:white;
}
header,footer {
color:white;background-color:#444;margin-bottom:5px;
}
section {
background-color:#ddd;
}
nav ul {
margin:0;padding:0;
}
nav ul li {
display:inline; margin:5px;
}
</style>
<body> <header>
<h1>Monday Times</h1>
</header> <nav>
<ul>
<li>News</li>
<li>Sports</li>
<li>Weather</li>
</ul>
</nav> <section>
<h2>News Section</h2> <article>
<h2>News Article</h2>
<p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum
lurum hurum turum.</p>
<p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum
lurum hurum turum.</p>
<p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum
lurum hurum turum.</p>
</article> <article>
<h2>News Article</h2>
<p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum
lurum hurum turum.</p>
<p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum
lurum hurum turum.</p>
<p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum
lurum hurum turum.</p>
</article> </section> <footer>
<p>© 2014 Monday Times. All rights reserved.</p>
</footer> </body>
</html>
result:
13 html5中使用<audio></audio>播放音频效果好
14 html5中使用<video></video>播放视频效果好
html_随笔的更多相关文章
- AI人工智能系列随笔
初探 AI人工智能系列随笔:syntaxnet 初探(1)
- 【置顶】CoreCLR系列随笔
CoreCLR配置系列 在Windows上编译和调试CoreCLR GC探索系列 C++随笔:.NET CoreCLR之GC探索(1) C++随笔:.NET CoreCLR之GC探索(2) C++随笔 ...
- C++随笔：.NET CoreCLR之GC探索（4）
今天继续来 带大家讲解CoreCLR之GC,首先我们继续看这个GCSample,这篇文章是上一篇文章的继续,如果有不清楚的,还请翻到我写的上一篇随笔.下面我们继续: // Initialize fre ...
- C++随笔：从Hello World 探秘CoreCLR的内部(1)
紧接着上次的问题,上次的问题其实很简单,就是HelloWorld.exe运行失败,而本文的目的,就是成功调试HelloWorld这个控制台应用程序. 通过我的寻找,其实是一个名为TryRun的文件出了 ...
- ASP.NET MVC 系列随笔汇总[未完待续……]
ASP.NET MVC 系列随笔汇总[未完待续……] 为了方便大家浏览所以整理一下,有的系列篇幅中不是很全面以后会慢慢的补全的. 学前篇之: ASP.NET MVC学前篇之扩展方法.链式编程 ASP. ...
- 使用Beautiful Soup编写一个爬虫 系列随笔汇总
这几篇博文只是为了记录学习Beautiful Soup的过程,不仅方便自己以后查看,也许能帮到同样在学习这个技术的朋友.通过学习Beautiful Soup基础知识 完成了一个简单的爬虫服务:从all ...
- 利用Python进行数据分析 基础系列随笔汇总
一共 15 篇随笔,主要是为了记录数据分析过程中的一些小 demo,分享给其他需要的网友,更为了方便以后自己查看,15 篇随笔,每篇内容基本都是以一句说明加一段代码的方式, 保持简单小巧,看起来也清晰 ...
- 《高性能javascript》 领悟随笔之-------DOM编程篇(二)
<高性能javascript> 领悟随笔之-------DOM编程篇二 序:在javaSctipt中,ECMASCRIPT规定了它的语法,BOM实现了页面与浏览器的交互,而DOM则承载着整 ...
- 《高性能javascript》 领悟随笔之-------DOM编程篇
<高性能javascript> 领悟随笔之-------DOM编程篇一 序:在javaSctipt中,ECMASCRIPT规定了它的语法,BOM实现了页面与浏览器的交互,而DOM则承载着整 ...
随机推荐
- [LeetCode] Text Justification 文本左右对齐
Given an array of words and a length L, format the text such that each line has exactly L characters ...
- [LeetCode] Substring with Concatenation of All Words 串联所有单词的子串
You are given a string, s, and a list of words, words, that are all of the same length. Find all sta ...
- SASS 入门笔记
参考资料: SASS 用法指南 SASS 语法 Sass Basics SASS_REFERENCE sass 有两种后缀名文件:一种后缀名为 sass,不使用大括号和分号:另一种就是我们这里使用的 ...
- 用vue.js学习es6（五）：set和map的使用
一:Set用法: ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. (1).打印:console.log var data = new Set([1,2,3]); ...
- android studio 使用jar包,arr包和怎么使用githup开源项目中的aar包或module
我这里的android studio的版本是2.2.3版本 一.现在大家都用android studio了,就有人问怎么使用jar包 其实使用jar包比较简单 直接吧jar放入工程的app目录下的li ...
- 关于CAJViewer 无法获取document路径问题
修改注册表 进入注册表编辑器: win+R >>输入 regedit 如下图: 修改关键注册表项(两项相同值应同时修改) 1.HKEY_CURRENT_USER\Software\Mic ...
- C#笔记
关键字: 1.internal 被 internal 修饰的东西只能在本程序集(当前项目)内被使用. 注意事项: 1.解决c#代码引用c/c++代码出现的unsafe code错误警告提示 Unsaf ...
- 输入流和字符串互转，InputStream2String，String2InputStream
输入流转字符串 public static String InputStream2String(InputStream in) { InputStreamReader reader = null; t ...
- com.panie 项目开发随笔_功能任务设计（2016.12.28）
(一) 第一个菜单 做什么好呢? 1)上次 在研究的功能 是 爬虫,需要将定时爬虫的任务加进来 2)博客的页面,也需要重新布局出来 3)需要做一个,添加博客的页面 (二) 那就先做博客管理吧! 先添加 ...
- jq方法中 $(window).load() 与 $(document).ready() 的区别
通过自学进入了前端的行列,只知道在js中,一开头就写一个: window.onload = function(){ //doing sth} 然后所有的乱七八糟的代码全塞里面,大概知道window.o ...