一：HTML5

1.html中的meta标签

定义针对搜索引擎的关键词：

<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript" />

定义对页面的描述：

<meta name="description" content="免费的 web 技术教程。" />

定义页面的最新版本：

<meta name="revised" content="David, 2008/8/8/" />

每 5 秒刷新一次页面：

<meta http-equiv="refresh" content="5" />

content 属性提供了名称/值对中的值。该值可以是任何有效的字符串。

content 属性始终要和 name 属性或 http-equiv 属性一起使用。

二.CSS3主要应用

1.margin的应用

<!DOCTYPE html>

<html>

<head>

	<title>css学习</title>

	<style type="text/css">

		.box{

			background-color: #eee;

 			overflow: hidden;//不加上这句话垂直方向上的margin会与父容器发生重叠现象，如图一，加上如图二
		}

		.box1{

			background-color: blue;

			margin: 20px;

			height: 50px;

		}

		.box2{

			height: 50px;

			background-color: red;

			margin: 20px;

		}

	</style>

</head>

<body>

	<div class="box">

		<div class="box1"></div>

		<div class="box2"></div>

	</div>

</body>

</html>

　　图一：                                       图二：在父容器中加上overflow: hidden;

一般img标签打头的小图标与文字对齐的话，img{margin:0 3px -3px 0;}可以说是公式版的东西，能实现效果和兼容性俱佳的对齐效果。（张鑫旭大神说的）

2.对于单选框和复选框与文字对齐的情况

在复（单）选框字体为14px的时候，页面上是对齐的，但是小于14px后，会有偏差

如图字体在12px时发生偏差：

<div class="box1">

	<input class="checkbox" type="checkbox" id="checkbox1" name="" value="" />

	<label for='checkbox1'>复选框1</label>

	<input class="checkbox" type="checkbox" id="checkbox2" name="复选框" value="" />

	<label for='checkbox2'>复选框2</label>

</div>

<div class="box1">

	<input class="checkbox" type="radio" id="radio1" name="单选框"/>

	<label for='radio1'>单选框1</label>

	<input class="checkbox" type="radio" id="radio2" name="单选框"/>

	<label for='radio2'>单选框1</label>

</div>
//复（单）选框样式
.checkbox{

    font-size:12px;

    vertical-align: -2px;

}

　　

看到网上很多的方法，但是兼容性多不怎么好，直接写上用过的兼容性最好的一种方法给复（单）选框加上vertical-align: -2px;样式；能兼容谷歌、火狐、IE11,10,9,8。。。

未完待续。。。。。。。。。。。。。

html5+css3相关知识的更多相关文章

  1. HTML5 & CSS3 初学者指南(4) – Canvas使用

    介绍 传统的HTML主要用于文本的创建,可以通过<img>标签插入图像,动画的实现则需要第三方插件.在这方面,传统的HTML极其缺乏满足现代网页多媒体需求的能力.HTML5的到来,带来了新 ...

  2. HTML5 & CSS3初学者指南(4) – Canvas使用

    介绍 传统的HTML主要用于文本的创建,可以通过<img>标签插入图像,动画的实现则需要第三方插件.在这方面,传统的HTML极其缺乏满足现代网页多媒体需求的能力.HTML5的到来,带来了新 ...

  3. 第九十二节，html5+css3移动手机端流体布局，开篇知识

    html5+css3移动手机端流体布局,开篇知识 将项目设计成移动端可访问的页面,项目采用的是流体布局.也就是宽度以百分比自适应的,因为手机的屏幕大小不一致  一．整体设计     首先 我们要了解一 ...

  4. 9款超绚丽的HTML5/CSS3应用和动画特效

    1.CSS3飘带状3D菜单 菜单带小图标 这次我们要来分享一款很特别的CSS3菜单,菜单的外观是飘带状的,并且每一个菜单项有一个精美的小图标,鼠标滑过菜单项时,菜单项就会向上凸起,像是飘带飘动一样,形 ...

  5. 《零基础学HTML5+CSS3(全彩版)》读书笔记

    2019年1月31日星期四 1点 <零基础学HTML5+CSS3(全彩版)>开始全面学习 前提: 11月20日开始学Python,可能因为太累了,也可能遇到了瓶颈,进入了一个迷茫期,1月6 ...

  6. 【Web前端HTML5&CSS3】11-定位

    笔记来源:尚硅谷Web前端HTML5&CSS3初学者零基础入门全套完整版 目录 定位的简介 1. 相对定位 偏移量(offset) 相对定位的特点 2. 绝对定位 绝对定位的特点 包含块(co ...

  7. 02.Web大前端时代之：HTML5+CSS3入门系列~H5结构元素

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 1.结构元素 可以理解为语义话标记,比如:以前这么写&l ...

  8. 03.Web大前端时代之：HTML5+CSS3入门系列~H5功能元素

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 2.功能元素 1.hgroup 对网页或区段(secti ...

  9. 12款非常精致的免费 HTML5 & CSS3 网站模板

    01. Joefrey Mahusay 很炫的单页网站模板,基于 HTML5 & CSS3 制作,适合用于设计师个人简历.摄影师和平面设计师的个人作品展示. 演示  下载 02. Folder ...

随机推荐

  1. sublimText3 快捷键大全（转）

    Ctrl+D 选中光标所占的文本,继续操作则会选中下一个相同的文本. Alt+F3 选中文本按下快捷键,即可一次性选择全部的相同文本进行同时编辑.举个栗子:快速选中并更改所有相同的变量名.函数名等. ...

  2. sublim Text3 配置python3环境

    一.安装Sublime Text 3 1.双击下载的.exe文件安装,安装路径不要有中文目录 2.安装Sublime Text 3时,勾选“Add to explorer context menu”, ...

  3. Node笔记(1)

    Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境.  进程 1.process.argv 用于获取当前进程信息 0--node.exe的目录1--js文件的目录2 ...

  4. MySQL数据库唯一性设置(unique index)

    1,命令行操作 分为两种.一种是在建表时就想好要加上唯一性,另一种是在后期才发现需要设置唯一性. 建表时: CREATE TABLE `t_user` ( `Id` int(11) NOT NULL ...

  5. BA-siemens-insight在win7下如何配置opc接口

    一.运行环境:win7(OPC接口在win_xp下配置需安装插件,不好意思没搞定,现在只有win7系统32位下的教程了) 由于OPC(OLE for Process Control)建立在Micros ...

  6. openwrt针对RT5350代码下载，配置和编译

    转载地址:http://blog.csdn.net/dean_gdp/article/details/37091685 近期买了块官方板的RT5350: 先介绍代码下载.下面命令都是用登录用户运行,无 ...

  7. 使用UE4公布安卓平台游戏

    使用了几天的UE4 ,总算是将游戏在安卓平台执行起来了.当中遇到非常多问题,而且终于依旧有一些问题没能解决. 整体感觉是UE4这款引擎眼下还不够成熟.问题较多. 没有unity使用起来方便. 可是既然 ...

  8. Apache + Tomcat 负载均衡 session复制

    转自:http://blog.csdn.net/cssmhyl/article/details/8455400 http://snowolf.iteye.com/blog/743611 Apache  ...

  9. c 语言函数可变參数的处理

    /************************************************************************* > File Name: va_list.c ...

  10. 宝马男砍人不慎刀落反被杀 防卫过当or故意伤害（在生命受到威胁的情况下，已经很难判断对方意图了，而且假如于莫是老弱妇幼，可能现在死的就是于莫了）

    如果被砍的是周律师他就不会说是防为过当吧,宝马车主跑回自己的车边时最危险,不知道他车上还有什么刀枪之类的.这如果判防卫过当,恶人会更恶,老实人连防卫都不敢了. 不知道在这个没有法治的国家会是如何判案的 ...