Html,Css,Dom,javascript细节总结
最近愈发觉得基础的重要性,细节决定成败,所以希望能够将自己注意到的搜集到的一些关于前端的小细节小知识整理出来,更好的方便自己记忆回顾。
1.在构建网页Html框架时,尽量只给外层标记(即是父标记)定义类别class或id,内层标记(即是子标记)能通过嵌套表示的则利用嵌套的方式,而不需要再定义新的类别或者专用id。选择器的嵌套和选择器的集体声明可以大大减少对类别class、id的声明,简化Css代码。
2.在Html页面中,颜色统一采用RGB即是“红绿蓝”三原色模式。每种颜色都由这3种颜色的不同比重组成,分为0~255档,例如 rgb(100%、100%、100%)、rgb(255,255,255)、#FFFFFF都指代白色,其中#FFFFFF为十六进制的表示方法,前两位为红色分量,中间为绿色分量,最后两位是蓝色分量。
关于颜色的基础,推荐阅读:http://jingyan.baidu.com/article/ab0b5630c585e8c15bfa7d75.html
3.在不同的浏览器中,width和height的值的兼容性很差,如果不进行特殊的声明,在IE7中指的是content(内容)+padding(间隙)+border (边框) 的宽或者高,而在Firefox或者google里面指的是content的宽和高。为了使其在不同浏览器中兼容,可在Html第一行进行如下声明:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
这样,则指代的都是content的宽和高。 <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前。
具体<!DOCTYPE>声明用法可参见:http://www.w3school.com.cn/tags/tag_doctype.asp
4.top、right、bottom、left这4个Css属性,它们都必须要配合position属性来使用的,表示的是块的各个边界离页面的边框(position属性设置为absolute时)或者原来的位置(position属性设置为relative时)的距离。
5.如果在使用getElementById()获取给定的id的节点时,有同名元素的name属性,在IE浏览器中还会返回这个元素。这是一个非常严重的Bug,所以我们在搭建框架的时候应该尽量避免id与其他元素的name属性重复。
6.meta是html语言head区的一个辅助性标签。几乎所有的网页里,我们可以看到类似下面这段的html代码:
<head>
<meta http-equiv="content-Type" content="text/html; charset=gb2312">
</head>
也许你认为这些代码可有可无。其实如果你能够用好meta标签,会给你带来意想不到的效果,例如加入关键字会自动被大型搜索网站自动搜集;可以设定页面格式及刷新等等。另外,为了让浏览器识别正确的编码,meta charset标签应该先于title标签出现。
7.<div>与<span>标签的区别:<div>是一个块级(block-level)元素,内元素会自动换行,而<span>仅仅是一个行内元素,在它的前后不会换行。
8.XHTML 1.0要求所有的标签必须关闭,所有没有成对的空标签必须以 />结尾。例如<hr>是错误的写法,须写成<hr/>,<input type="text" name="name">是错误的写法,须写成 <input type="text" name="name" />。
Html,Css,Dom,javascript细节总结的更多相关文章
- HTML、css、javascript、DOM编程
HTML.css.javascript.DOM编程 一.Html 1.1html概述 Html就是超文本标记语言的简写,是最基础的网页语言,其代码都是由标签所组成,是通过标签来定义的语言,代码不需要区 ...
- 你所不了解的javascript操作DOM的细节知识点(一)
你所不了解的javascript操作DOM的细节知识点(一) 一:Node类型 DOM1级定义了一个Node接口,该接口是由DOM中的所有节点类型实现.每个节点都有一个nodeType属性,用于表明节 ...
- 新手理解HTML、CSS、javascript之间的关系
http://www.cnblogs.com/dreamingbaobei/p/5062901.html 工作多年,一直忙忙碌碌的应用各种技术,现在不忙了,问问自己究竟在做什么,究竟会什么竟答不上来, ...
- 利用CSS、JavaScript及Ajax实现图片预加载的三大方法
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...
- 解耦HTML、CSS和JavaScript
当前在互联网上,任何一个稍微复杂的网站或者应用程序都会包含许多HTML.CSS和JavaScript.随着互联网运用的发展以及我们对它的依赖性日益增加,设定一个关于组织和维护你的前端代码的计划是绝对需 ...
- 【转】HTML, CSS和Javascript调试入门
转 http://www.cnblogs.com/PurpleTide/archive/2011/11/25/2262269.html HTML, CSS和Javascript调试入门 本文介绍一些入 ...
- HOWTO: Create native-looking iPhone/iPad applications from HTML, CSS and JavaScript
HOWTO: Create native-looking iPhone/iPad applications from HTML, CSS and JavaScript Though it's not ...
- CSS和JavaScript以及Ajax实现预加载图片的方法及优缺点分析
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画 廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发 ...
- 利用CSS、JavaScript及Ajax实现图片预加载的三大方法(转)
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...
随机推荐
- Linux Shell 通配符、元字符、转义符【转帖】
作者:程默 说到shell通配符(wildcard),大家在使用时候会经常用到.下面是一个实例: 1 1 2 3 4 [chengmo@localhost ~/shell]$ ls a.txt ...
- Map的keySet和entrySet
/*Map集合的两种 取出方式 * 1.keySet() * 2.entrySet() * */ //定义一个学生类 重写了equals.hashcode三个方法,实现了comparable接口并覆盖 ...
- 【Beta】Daily Scrum Meeting第四次
1.任务进度 学号 已完成 接下去要做 502 修复和完善任务列表界面:将几个数据库操作封装起来 登陆时将返回的个人信息更新到本地数据库 509 创建报课表的API 给所有api添加注释:发布任务到服 ...
- 转载:iOS开发之让你的应用“动”起来
在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌.在这里你可以看到iOS中如何使用图层精简非交互式绘图,如何通过核心动画创建基础动画.关键帧动画.动画 ...
- angularJs 指令的理解
指令: 可以把指令理解成为特定的DOM 上运行的函数,指令扩展了这个元素的功能: 例如:ng-click--在DOM元素上绑定了一个click事件的监听,并在监听到事件时运行angular表达式 自定 ...
- Java的书写格式,标识符及命名规则,注释
Java的书写格式,标识符及命名规则,注释 1.Java语言的书写格式(约定成俗) 1) 大括号要对齐(左大括号与句尾对其,后面大括号与句头对齐),并且成对写 2) 左大括号前面有空格 3) 遇到左大 ...
- 【codevs】刷题记录→_→(推荐看!)
注:本文是我原先在csdn内写的一篇博文,现转到这里,两篇博文尽量同时更新. //#include<iostream->shuati> //define 为什么刷 学长☞hzwer ...
- jenkins配置源码管理git
一.首先安装上来jenkins 二.下载安装jenkins的git插件:Git plugin 三.新建一个jenkins项目,选择构建一个自由风格的软件项目: 源码管理选择git,Repository ...
- ASP.NET SignalR 高可用设计
在 One ASP.NET 的架构图中,微软将 WebAPI 和 SignalR 归类到 Services 类型与 MVC.Web Forms 同列为一等公民,未来的 ASP.NET 5 尽管还在be ...
- Kosaraju 算法检测有向图的强连通性
给定一个有向图 G = (V, E) ,对于任意一对顶点 u 和 v,有 u --> v 和 v --> u,亦即,顶点 u 和 v 是互相可达的,则说明该图 G 是强连通的(Strong ...