在这个年代，你要是不懂一点点css3的知识，你都不好意思说你是个美工。美你妹啊，请叫我前端工程师好不好。呃。。好吧，攻城尸。。。呵呵，作为一个攻城尸，没有点高端大气上档次的东西怎么能行呢，那么css3的动画就绝对是值得你拥有了，虽说IE9以及更早版本的IE浏览器都不支持css3动画，但是IE6-8浏览器已是江河日下，使用谷歌浏览器、火狐浏览器、IE10+浏览器以及移动端浏览器等这些支持css3动画的浏览器的人数越来越多，所以如果...
设置 class 属性值包含 "test" 的所有 div 元素的背景色：div[class*="test"] { background:#ffff00; }设置 class 属性值以 "test" 开头的所有 div 元素的背景色：div[class^="test"]{background:#ffff00;}原文：http://www.cnblogs.com/ada-zheng/p/4237078.html
CSS的属性，其中一个分类是有继承性和无继承性。总结一下父元素的哪些属性是会继承给其子元素的，单纯加深印象，有用得到的时候方便回来瞅瞅。下面的总结内容来自：https://www.cnblogs.com/thislbq/p/5882105.html有继承性的属性1、字体系列属性font：组合字体font-family：规定元素的字体系列font-weight：设置字体的粗细font-size：设置字体的尺寸font-style：定义字体的风格font-variant：设置小型大写字母的字体显示文本，这意...
tooltip(气泡提示)依赖脚本文件:CalvinTip.js样式文件:toolTip.css参数elemsHTMLNode必须气泡提示的元素optionsObject可选多选形式的可配置参数。以下是option参数的说明参数数据类型默认值说明contentstring<DIV style=‘color: rgb(0, 0, 0); font-family: "[object HTMLOptionElement]", Consolas, "Lucida Console", "Courier New";‘ class="source"> null气泡提示的文本arrowstringn气泡提示的方向 ...
第一种方法：背景图片法这种方法适用于非动态内容，图片用于装饰的情况下。主要是设置父元素的padding的宽度为背景图片的宽度加上图片和文字的间距，然后把背景图片定位到padding里面就可以了图文混排demo1，背景图片法 //因是转载的，我又是菜鸟，下面图片乱了，正确的是图片跟文字都在一行。 Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.Pellentesque habitant morbi tri...
颜色单位： 1、使用0-255之间的整数值来设置，如 color.rgb（128,0,128）2、使用16进制数组定义颜色，如#fc0eab3、为颜色取名：aqua，black，blue，fuchsia，gray，green等5盒模型：四个分层属性：1.内容（content）：元素中的内容；2、外边距（margin）：代表元素外边的空间，这个空间将元素相互分开；3、边框（border）：位于元素的边距内和元素的边框距外之间的可配置的线；4、内边距（padding）：元素内容和元素边框之间的空间...
我们知道通过 document.getElementById("argument"); //argument（元素）; value = argument.style.width;的方式可以轻松获取 或者读写该argument的样式（宽度）。但是我们知道这个属性是在<HMTL>标签中的，那么如果我们argument的样式写在CSS中呢？我们就需要用别的方法来获取它的样式值.那么，我们就要用到 getComputedStyle("argument",":after") .width //谷歌、火狐等非IE内核浏览器 argumet.c...
思路：1.首先构建五个环：把一个正方形用border-radiu设置成圆形，border控制环的宽度，五环的各自的div的top和left控制位置，使形成五环的样子。2.运用伪元素的，用 z-index控制优先级， border-*-color: transparent;控制透明。由于有限级都是一样的，所有前面的显示。控制透明的就可以显示出下面的元素，所以把1的下，2左，3左，5的上又透明，从而构成两两相扣。代码<!DOCTYPE html> <html><head><meta charset="utf-8"><title>...
jquery load + div实现异步加载资源，出现重复js和css资源的重复加载，导致js失效或重复执行等问题：调用load前执行语句： $.ajax({cache: false}) 关闭ajax缓存。此方法已经过时 $.ajaxSetup ({ cache: false }); According to http://api.jquery.com/jQuery.ajaxSetup/ it‘s use isn‘t recommended.Try using $.ajax({cache: false}) instead. 原文：http://www.cnblogs.com/mengyehongmanshan/p/6856730.html
客户端会缓存css或js文件，改变版本号，客户端浏览器就会重新下载新的js或css文件，在js或css后加?v= 版本号的用法如下代码如下:<span style="font-size:14px;">css和js带参数（形如.css?v=与.js?v= 或 .css?version=与.js?version= ） <script type=”text/javascript” src=”jb51.js?version=1.2.6″></script><link rel=’stylesheet’ href=’base.css?version=2.3.3′ type=’text/css’ />使用参数有两种可能： 第一、脚本...
首先是没有进行缩放的图 进行缩放后 代码：<style type="text/css">* {margin: 0px;padding: 0px;}#i {width: 300px;height: 500px;float: left;background-color: cornflowerblue;transform: scale(0.8);-webkit-transform-origin: 0 0;}#m {float: left;background-color: aquamarine;width: 300px;height: 500px;}</style></head><body><!-- 第一块 --><p id="i">...
复制代码代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>css实现的交互小三角箭头图标</title><style>p{border-color: transparent transparent #f0f0f0 transparent;border-style: solid;border-width: 0...
Unit02： CSS 概述 、 CSS 语法 、 CSS 选择器 、 CSS声明 my.cssp {color: yellow; }demo1.html<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><!-- 2.内部样式:在head元素内部的style标签内写样式,这种样式可以在当前网页上复用. --><style>/*CSS的注释是这样的*/h2 {color: blue;}</style><!-- 3.外部样式:在单独的css文件中写样式,需要通过link标签将其引入到网页上才有效.这种样式可...
1、使用document.write方式输出引入css的link标签在调用文件的顶部加入下例代码<script>document.write(‘<link rel="stylesheet" href="main.css">‘); </script>2、使用createElement方法动态创建link标签，来引入css在将下边代码放入Body中<script>new_element = document.createElement(‘link‘);new_element.setAttribute(‘rel‘, ‘stylesheet‘);new_element.setAttribute(‘href‘, ‘main.css‘);document.body.appendC...
1、绝对定位+负margin 兼容性很好，但需要指定子块的高度和宽度，以及负margin.wp{position: relative;width: 200px;height: 200px;background-color: #ccc; } .test{height: 100px;position: absolute;top:50%;left: 50%;margin-top: -50px;margin-left: -50px;background-color: #edd;width: 100px; }<div class="wp"><div class="test"></div></div> 2、绝对定位加margin:auto缺点：IE6\7不支持，需要指定子块的宽度和高度.wp{p...