css 选择器、元素默认宽度、media screen

@media screen and (min-width:800px){ 
.a{ 
　　background: url('../image/banner/banner1.jpg') no-repeat left top;
}
}

max-width：定义输出设备中的页面最大可见区域宽度   宽度小于800px里面的值才会生效

min-width：定义输出设备中的页面最小可见区域宽度  宽度大于800px里面的值才会生效

块元素（如div等）宽度默认是100% 既为父元素宽度的 100%.

body的默认宽度 除去margin等也是html父元素的100%

html的默认宽度  时浏览设备窗口的宽度

@media all and (orientation:landscape){ }横屏模式下
想问下如果在宽度小于800px的时候打开，这时候背.a不会加载图片

@media all and (orientation:portrait){ }竖屏模式下

选择器：

button[lichihua]   选取有lichihua的自定义属性的button标签元素

<button lichihua="disabled">lichihua</button>

button[disabled]     选取有disabled属性的button标签元素

<button disabled="disabled">lichihua</button>

input[type="submit"][disabled]    选取type="submit"并且有disabled属性的input标签元素

<input type="submit" disabled="disabled" name="" value="确定">

input.form-submit.disabled（拥有form-submit和disabled类的input）注意 input.form-submit这里的input和点之间没有空格！！！！

input[type="submit"].disabled  （拥有disabled类并且type属性为submit的input）

input.form-submit[disabled]    （拥有form-submit类并且拥有disabled属性的input）

input[type="submit"][disabled]  （type属性为submit 并且拥有disabled属性的input）
<input type="submit" class="form-submit disabled" disabled="disabled" name="" id="editgroup" value="编辑角色组">

CSS3中，合理的使用通配符，可以大大提高效率，以下为测试示例。

“^”开头字母匹配；“$”结尾字符匹配；“*”包含字符匹配

对于类似下面的样式：可以用通配符

#name_1{margin-top:10px}

#name_2{margin-top:10px}

#name_3{margin-top:10px}

#name_4{margin-top:10px}，

可写作[id^="name_"]{margin-top:10px}

1    AlT+R : 启用正则匹配

2   ALT+C : 启用区分大小写

3  ALT+W : 启用整个字

4 循环查找

删除当前行  Ctrl+Shift+K

Ctrl+L：选择行，重复可依次增加选择下一行

Ctrl+C   复制 

Ctrl+M  光标移动到括号里的开始或者结束位置： 比如trim(|'str|'|)   光标会从蓝色的跳到红色的这两个位置

Ctrl+Enter    下一行（当前行后插入新的一行）

Ctrl+Enter    上一行（当前行前插入新的一行）

Ctrl+Shift+M  选择括号（）｛｝里的内容：

ctrl+shift+d  如果你已经选中了文本,它会复制你的选中项。否则,把光标放在行上,会复制整行快速复制光标所在的一整行，并复制到该行之前。

光标定位到某一行-》ctrl+shift+↑↓，上下交换一行。

display和visibility属性差别

visibility="visible|hidden"，visible显示，hidden隐藏。

当visibility被设置为"hidden"的时候，元素虽然被隐藏了，但它仍然占据它原来所在的位置。

display:inline|block|none  

inline：行元素 兄弟标签不换行

block：块元素,每个带有block的元素各占一行（换行）

还有个hidden是html的属性不是css他表示域浏览器不相关一般用在表单交互上如input

transition: 过渡的css属性[必须] 过渡效果总时间[必须] 过渡曲线 效果开始前等待的时间;

用户不能鼠标左键选择文本

-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;/*不能选择文字*/

元素周围的一条线，位于边框边缘的外围不占空间

outline:none;

规定边框边缘之外 15 像素处的轮廓

outline-offset:0;

用户不能鼠标左键选择文本

Flex布局

-webkit-box-flex: auto;
-moz-box-flex: auto;
-webkit-flex: auto;
-ms-flex: auto;
flex: auto;

box-sizing

box-sizing: content-box|border-box|inherit:

c传统的css盒子：padding + border + width= 盒子的宽度

设置成box-sizing: content-box