Html,Css,Dom,javascript一些细节
2014-03-04 10:07
696 查看
转自:http://www.cnblogs.com/coco1s/p/3578947.html
看到别人搜集到的一些关于前端的小细节小知识在这里分享一下:
1.在构建网页Html框架时,尽量只给外层标记(即是父标记)定义类别class或id,内层标记(即是子标记)能通过嵌套表示的则利用嵌套的方式,而不需要再定义新的类别或者专用id。选择器的嵌套和选择器的集体声明可以大大减少对类别class、id的声明,简化Css代码。
2.在Html页面中,颜色统一采用RGB即是“红绿蓝”三原色模式。每种颜色都由这3种颜色的不同比重组成,分为0~255档,例如 rgb(100%、100%、100%)、rgb(255,255,255)、#FFFFFF都指代白色,其中#FFFFFF为十六进制的表示方法,前两位为红色分量,中间为绿色分量,最后两位是蓝色分量。
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属性重复。
看到别人搜集到的一些关于前端的小细节小知识在这里分享一下:
1.在构建网页Html框架时,尽量只给外层标记(即是父标记)定义类别class或id,内层标记(即是子标记)能通过嵌套表示的则利用嵌套的方式,而不需要再定义新的类别或者专用id。选择器的嵌套和选择器的集体声明可以大大减少对类别class、id的声明,简化Css代码。
2.在Html页面中,颜色统一采用RGB即是“红绿蓝”三原色模式。每种颜色都由这3种颜色的不同比重组成,分为0~255档,例如 rgb(100%、100%、100%)、rgb(255,255,255)、#FFFFFF都指代白色,其中#FFFFFF为十六进制的表示方法,前两位为红色分量,中间为绿色分量,最后两位是蓝色分量。
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属性重复。
相关文章推荐
- Html,Css,Dom,javascript细节总结
- javascript、css、html来制作交互式网页的一些必备技巧
- 韩顺平_轻松搞定网页设计(html+css+javascript)_第26讲_js函数调用过程内存分析_js函数细节_学习笔记_源代码图解_PPT文档整理
- 韩顺平_轻松搞定网页设计(html+css+javascript)_第30讲_类和对象细节_创建对象的几种方式_js对象内存分析_学习笔记_源代码图解_PPT文档整理
- 浏览器加载渲染HTML、DOM、CSS、 javascript、image、flash、iframe、src属性等资源的顺序总结
- JavaScript-DOM操作HTML、CSS
- 总结一些更多的针对webkit的HTML, CSS和Javascript方面的特性.
- Javascript 操作 DOM 的一些细节备注(一)
- Javascript,html,css学习过程中的小细节。——持续更新——
- Html、CSS、DOM、JavaScript
- 韩顺平_轻松搞定网页设计(html+css+javascript)_第27讲_js一维数组_一维数组细节_学习笔记_源代码图解_PPT文档整理
- 浏览器加载渲染HTML、DOM、CSS、 JAVASCRIPT、IMAGE、FLASH、IFRAME、SRC属性等资源的顺序总结
- HTML、JavaScript、Dom、css
- HTML DOM & JavaScript & CSS
- 1st JavaScript Editor Pro 3.8,强大的JavaScript开发工具(JavaScript IDE),完美支持CSS, HTML, DOM and DHTML开发、校验、调试
- 总结一些更多的针对webkit的HTML, CSS和Javascript方面的特性.
- HTML CSS JAVASCRIPT JSON DOM JQUERY PHP
- 一些非常有用的html,css,javascript代码片段(持久更新)
- 一些学习前端的网站(html&css&javascript等)持续更新。。。