一: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. Virtual servers on a Raspberry Pi with the light weight OS virtualization system Docker!

    转自:http://www.hyggeit.dk/2014/02/virtual-servers-on-raspberry-pi-with.html Virtual servers on a Rasp ...

  2. PHP 闭包之变量作用域

      在项目中,难免会遇到闭包的形式,那么在闭包中,变量的作用域到底是怎么样的呢.下面有几个简单的例子. e1 function test_1() { $a = 'php'; $func = funct ...

  3. 【codeforces 716D】Complete The Graph

    [题目链接]:http://codeforces.com/problemset/problem/716/D [题意] 给你一张图; 这张图上有一些边的权值未知; 让你确定这些权值(改成一个正整数) 使 ...

  4. 2015 Multi-University Training Contest 8 hdu 5383 Yu-Gi-Oh!

    Yu-Gi-Oh! Time Limit: 2000ms Memory Limit: 65536KB This problem will be judged on HDU. Original ID:  ...

  5. [SharePoint][SharePoint Designer 入门经典]Chapter7 数据源和外部内容类型

    本章概要: 1.SharePoint能够使用的数据类型 2.如何从SharePoint列表和库中取得数据并展现出来 3.SharePoint访问远程数据 4.如何把外部数据源作为列表展现在你的SPS站 ...

  6. Hadoop使用Java进行文件修改删除操作

    Hadoop使用Java进行文件修改删除操作 学习了:http://blog.csdn.net/menghuannvxia/article/details/44651061 学习了:http://bl ...

  7. C语言之函数调用11—递归法求Hermite函数

    /*递归法! ========================================== 题目: Hermite 函数:输入n.x,求Hn(x)? H0(x)=1; H1(x)=2*x; H ...

  8. centos 下 KVM虚拟机的创建、管理与迁移

    kvm虚拟机管理 一.环境 role         hostname    ip                  OS kvm_server   target      192.168.32.40 ...

  9. UVA 1541 - To Bet or Not To Bet 记忆化DP概率

    Alexander Charles McMillan loves to gamble, and during his last trip to the casino he ran across a n ...

  10. Linux less命令简介

    less命令可以对文件或其它输出进行分页显示,与moe命令相似,但是比more命令要强大许多. 在 less 中导航命令类似于 vi,如下: 1 搜索 当使用命令 less file-name 打开一 ...