<p>标签不能再包含<p>,也不能包含<div>,<div>可以包含<p>
a 和 img 标签是特殊的行内元素,a标签可以包含div等,几乎所有的可替换元素都是行内元素,例如<img>、<input>等等,替换元素一般有内在尺寸,所以具有width和height,可以设定。例如你不指定img的width和height时,就按其内在尺寸显示,也就是图片被保存的时候的宽度和高度。
对于表单元素,浏览器也有默认的样式,包括宽度和高度。
 
margin-top/bottom(padding-top/bottom)百分比以最近的块级祖先元素的宽度计算
 
dt 标签的属性重新设置只是白白浪费,增加页面渲染负荷

padding 属性值极少的标签有,其他标签无需浪费时间重新渲染

要是前后没有直接的浮动元素,使用clear:both就是多余的

inline水平的元素对很多CSS样式都不起反应,例如height/width, clear, margin-top/margin-bottom, vertical-align, overflow等

block水平的元素对vertical-align属性没有作用。

a{display:inline-block; *display:inline; *zoom:1;}
这是设置元素的inline-block属性,但是对于inline行内元素来说,后面的两个样式就是多余的,因为display:inline-block可以让inline水平的元素表现的就如同真正的inline-block水平一样。

margin负数可以增大标签的宽度,不需要用width

input ,textarea select 本身有文字大小,不会跟随父级标签,所以需要重新设置
input,textarea,select{font-size:100%}

文本框及文本域100%自适应显示,光标通常需要与左边保持一定距离
input{width:92%; padding-left:4%; padding-right:4%;}

根据 CSS 规范,inline 元素只能包含 block 元素或 inline 元素中的一种。如果出现了混合内容,则应创建匿名的 block 呈现器,以包裹 inline 元素。

transform 的旋转rotate默认的是以元素的 50% 50% 为源点来旋转的
 
overflow:hidden/scroll/auto 也会使文件有包裹性,能够把float元素封在里面,通常拿来修复float影响,重现获得高度
zoom在 IE6 7 上有包裹性,变成块元素, 本元素放大
 
宽度百分比都是相对于父块状元素的宽度值的,font-size的百分值是相对于向外的第一含有font-size属性的层的font-size大小而言的,而这里的vertical-align,有些不拘一格,是相对于此标签继承的line-height值决定的。同时宽元素宽度默认100%,但是高度没有,应该是出于布局考虑。
 
隐藏滚动栏
document.body.style.overflow="hidden";
 
伪元素在css3的写法是::after,都是以双冒号开头,而css2的写法则是这样:after,并且需要把伪元素(pseudo element)和伪类(pseudo classes)区分开来,他们拥有伪类的写法,但是却不是伪类,目前已知的伪元素就只有5个,分别是before,after,first-line,first-letter,selection
伪类可以独立于文档的元素来分配样式,且可以分配给任何元素,逻辑上和功能上类类似,但是其是预定义的、不存在于文档树中且表达方式也不同,所以叫伪类。
伪元素所控制的内容和一个元素控制的内容一样,但是伪元素不存在于文档树中,不是真正的元素,所以叫伪元素。

css相关 细节 优化 备忘的更多相关文章

  1. CSS系列:less备忘

    less备忘 //这是一个运行在koala中的less文件,//注释不会被编译到css文件中,/**/注释会 ****************by 李可 2016/04/19 /*所有,所有伪类*/ ...

  2. CSSの神小结-简单备忘一下(亲测可用)

    css 选择器优先级,标签>id>class 权重 id>class>标签 只记录能想到的以免遗忘: 1.字体css可继承 2.表格:表格细线的合并,表格单元格合并,单元格内容 ...

  3. HttpContext.Current.Session.SessionID相关问题及备忘

    今天Tony提到说我们系统中会利用如下代码来判断用户是否过期. if (string.IsNullOrEmpty(UserContext.ConnectionSessionId)) { LogUIFa ...

  4. C++编译优化备忘

    基于GCC测试:http://www.tutorialspoint.com/compile_cpp11_online.php const A& a=fun() 与 A a= fun() 1.方 ...

  5. Windows相关操作(备忘)

    查看服务端口是否能通:telnet 192.168.1.11 8888 查看端口是否被占用 netstat -ano

  6. php 相关模块备忘

    在安装php的时候,不管是编译安装: ./configure --prefix=/usr/local/php --with-config-file-path=/usr/local/php/etc -- ...

  7. [原]TCP/UDP使用细节备忘

    body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...

  8. 备忘:CSS术语词汇表——张鑫旭

    一.叨点什么 写文章的时候经常用到一些CSS方面的专业词汇.但是毕竟芳华年少不在,脑袋有点秀逗了,很多名词都记不住,这种感觉比厕所便秘还难受.比如今天居然记不起来公司公认脸蛋最pp的同事的名字,没想到 ...

  9. [转] HTML5终极备忘大全(图片版+文字版)---张鑫旭

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1544 一.前言兼图片 ...

随机推荐

  1. 实例讲解js正则表达式的使用

    前言:正则表达式(regular expression)反反复复学了多次,学了又忘,忘了又学,这次打算把基本的东西都整理出来,加强记忆,也方便下次查询. 学习正则表达式之前首先需要掌握记忆这些基本概念 ...

  2. JavaScript案例开发之扑克游戏

    随着时代的发展,知识也在日益更新,但是基础知识永远不会过时,它是新时代的基石,更是我们进一步学习的保障,下面带着大家用JavaScript开发一款真正的扑克游戏,和大家一起分享,希望你们能够喜欢:闲话 ...

  3. 剑指offer(纪念版)读书笔记【实时更新】

    C++ 1.STL的vector每次扩充容量,新容量是前一次的两倍. 2.32位机指针大小为4个字节,64位机指针大小为8个字节. 3.当数组作为函数参数传递时,数组会自动退化成同类型指针. 4. & ...

  4. Linux crontab任务调度

    一.crontab说明 Linux crontab任务调度是在规定的时间频率内去执行相应的任务. 二.crontab文件详情 1.crontab文件在Linux中的/etc/crontab 2.查看c ...

  5. 使用siege对web接口进行post方式的压力测试

    为了达到压力测试的效果,需要申请一台线上机器,并且安装压力测试的工具siege. 安装新版siege.资料说yum安装的版本2.70对于post方式支持的不好,验证后发现请求可以正常发过去,但是打开d ...

  6. Extjs6(七)——增删查改之删除

    本文基于ext-6.0.0 页面就是前面写的那个,有不清楚的可以看一下前面写页面那篇. 一.在toolbar加一个删除按钮 { text:'删除', iconCls:'x-fa fa-times', ...

  7. JFinal快速上手及注意事项

    官方手册虽然写的很详细但是忽略的很多小的细节方面,不看源码,网络资料又少,很多新手找不到解决办法.所以养成出了问题,多看源码的习惯 部署helloJFinal 项目结构 - 相关代码 `package ...

  8. Java IO流 思维导图

  9. Java IO(IO流)-2

    IO流 第一部分 (OutputStreamWriter BufferOutputStream) 转换流 超类为Reader和Writer 是字符流通向字节流的桥梁:可使用指定的字符编码表,将要写入流 ...

  10. Python 3.6.3 官网 下载 安装 测试 入门教程 (windows)

    1. 官网下载 Python 3.6.3 访问 Python 官网 https://www.python.org/ 点击 Downloads => Python 3.6.3 下载 Python ...