文字样式属性： 格式：font-style:italic;/normal; 快捷键：fsi / fsn + tab键文字粗细属性： 格式：font-weight:bold;/bolder;/lighter; 快捷键：fwb / fwbr / fwl + tab键文字大小属性： 格式：font-size:300px; （px是像素） 快捷键：fz300 + tab键文字字体属性： 格式：font-family:"楷体"; 快捷键：ff + tab键 中午要用引号括起来，设置的字体得是电...
CSS 的属性值中经常会出现百分比，搞清它们的基数是一件很重要的事情。我特意查看了一下 W3C 的 CSS2.1 标准，在此整理下： 百分比单位 乘以包含块的宽度 margin, padding, left, right, text-indent, width, max-width, min-width 乘以包含块的高度 top, bottom, height, max-height, min-height 关于包含块（containing block）的概念，不能简单地理解成是父元素。如果是静态定位和相对定位，包含块一般就是其父元素。但是对于绝...
1、border 边框可以按顺序设置如下边框属性： 属性值描述border-width 以PX为单位 边框的粗细border-style1、solid 实线2、dashed 虚线3、dotted 点线 边框的样式 border-color可以用英文，如：red也可以在色板里选择边框的颜色 通常采用简写的方式：简写方式：border:solid 1px #FOF;实例： HTML部分：<div id="d1"></div>CSS部分：#d1 {width:100px; /* 宽度 */height:100px; /* 高度 */bo...
1. 创建标签 document.createElement()2.$(tag).css(‘属性‘， 样式) 赋予标签属性样式3.设置定时器 改变位置 大小<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title><style>.container{padding: 50px;border: 1px solid #eeeeee;}.item{cursor: pointer;position: relative;width: 30px;}</style></head><body><div class="container"><div class="item"><span>赞</span></div></div><div class=...
《CSS3基本选择器》一、通配符选择器（＊）*{marigin:0;padding:0;}二、元素选择器(E)li {background-color: grey;color: orange;}三、类选择器（.className）四、id选择器（#ID）#first {background: lime;color:#000;}#last {background:#000;color: lime;}五、后代选择器（ＥＦ）.demo li {color: blue;}六、子元素选择器(E>F)ul > li {background: green;color: yellow;}七、相邻兄弟元素选择器(E + F)li + li {background: gr...
一、可继承属性1》所有标签可继承：visibility:行高cursor:2》内联标签可继承：line-height:行高color:文字颜色font-family:文字字体font-size:文字大小font-weight:文字加粗text-decoration:文字下划线3》块级标签可继承：text-indent:缩进text-aligin:对齐4》列表标签可继承：list-style:列表二、不可继承属性display、margin、border、padding、backgroundheight、min-height、max-height、width、min-width、max-widthoverflow...
像下面图中的布局，如果排列的元素是登高的话，相信很多人都会使用浮动来布局，不过如果元素不等高的话，不添加多余的标签，浮动布局是很难实现下图中的效果。如果遇到这种情况，可以使用inline-block来布局。 现代浏览器的最新版都支持inline-block，只有该死的ie6、7不支持inline-block，但ie6、7可以通过 display：inline；zoom：1；来模拟。 下面是inline-block兼容的代码： 复制代码代码如下:display:inline-block;*display:i...
在CSS3中，可以利用transform功能来实现文字或图像的旋转、缩放、倾斜、移动这四种类型的变形处理，本文将对此做详细介绍。一.旋转 rotate用法：transform: rotate(45deg);共一个参数“角度”，单位deg为度的意思，正数为顺时针旋转，负数为逆时针旋转，上述代码作用是顺时针旋转45度。二.缩放 scale用法：transform: scale(0.5) 或者 transform: scale(0.5, 2);参数表示缩放倍数；一个参数时：表示水平和垂直同时缩放该倍率两个...
【box-shadow属性】：是一个css3属性，用于创建阴影效果。语法：box-shadow:offset-x offset-y blur spresd color position;属性值说明：offset-x offset-y指的是元素水平偏移量；blur：表示阴影的模糊半径；spread：阴影尺寸（从元素到阴影的距离），正值会在元素的各个方向按指定的数值延伸阴影，负值会使阴影收缩的比本身元素的尺寸还小。color：阴影的颜色值；position：可选，表示阴影的位置，默认值是外部阴影，关键字inset指...
在css布局中，position发挥了极其重要的作用，很多的网页布局都要用position来完成。position有四个属性值static、absolute、relative、fixed。static这个属性表示默认的位置，在设置它的时候，可以取消继承属性，在一般情况下则不需要设置这个属性。absolute这个属性表示绝对定位。绝对定位的元素的位置相对于最近的已定位祖先元素，如果元素没有已定位的祖先元素，那么它的位置就会相对于最初的包含块。元素原先在正常文档流中所...
在做项目的时候，居然单击后显示的顺序一直被别的li标签压着，最后终于找到了，是css的z-index属性赋值了，值越大，显示的层就越高详情推荐百度百科：z-indexz-index是针对网页显示中的一个特殊属性。因为显示器是显示的图案是一个二维平面，拥有x轴和y轴来表示位置属性。为了表示三维立体的概念如显示元素的上下层的叠加顺序引入了z-index属性来表示z轴的区别。表示一个元素在叠加顺序上的上下立体关系。 引用方法 z-index : auto...
思路：1，先做1个正方形，然后旋转45°即可让箭头分别朝向上下左右2，需要那个朝向的箭头就分别设置这个箭头两边边框颜色，如下代码可以实现箭头朝右div {width: 8px;height: 8px;border-top: 1px solid #666;border-right: 1px solid #666;transform: rotate(45deg); } 原文：https://www.cnblogs.com/JeffreyZhu/p/15177160.html
http://ued.ctrip.com/blog/wp-content/webkitcss/prop/user-select.html原文：http://www.cnblogs.com/zhwl/p/3524842.html
CSS的属性，其中一个分类是有继承性和无继承性。总结一下父元素的哪些属性是会继承给其子元素的，单纯加深印象，有用得到的时候方便回来瞅瞅。下面的总结内容来自：https://www.cnblogs.com/thislbq/p/5882105.html有继承性的属性1、字体系列属性font：组合字体font-family：规定元素的字体系列font-weight：设置字体的粗细font-size：设置字体的尺寸font-style：定义字体的风格font-variant：设置小型大写字母的字体显示文本，这意...
问题最近在使用background-image属性来实现CSS3的逐帧动画时，碰到了个问题。在chrome浏览器上，background-image属性是支持css3动画的，但是到了firefox上，就完全看不到任何动画。原因通过网上查找，才发现W3C标准中明确background-image属性是不支持动画的，所以firefox由于遵循了该标准，并没有给该属性支持动画。解决过程解决方法是使用backgrond-position属性，该属性在W3C标准中是支持动画的，因此所有浏览器应该是可以支持...