css 集锦。
- 可以是 链接的下划线 去掉。
a {text-decoration: none}
position:absolute 绝对定位
position:relative 相对定位
ie 图片失真
-ms-interpolation-mode
img {-ms-interpolation-mode:bicubic;}
class 在css中是用“.”, id 是用 “#” 。
before after content 是三个 伪元素。
<!DOCTYPE html>
<html>
<head>
<style>
p:before
{
content:"台词:";
}
</style>
</head> <body> <p>我是唐老鸭。</p>
<p>我住在 Duckburg。</p> <p><b>注释:</b>对于在 IE8 中工作的 :before,必须声明 DOCTYPE。</p> </body>
</html>
结果为:

ol ul li 解释。。
ol 是会有 编号的。例如
<div>
<ol>
<li>1111</li>
<li>2111111111</li>
<li>31111111111</li>
<li>4111111111</li>
</ol>
</div>
结果为:

ul 代码:
<div>
<ul >
<li>1111</li>
<li>2111111111</li>
<li>31111111111</li>
<li>4111111111</li>
</ul>
</div>
结果为:

如果 ul 加上style 样式的话,
<div>
<ul style="list-style:none;">
<li>1111</li>
<li>2111111111</li>
<li>31111111111</li>
<li>4111111111</li>
</ul>
</div>
结果为:

会没有前边的 点点。
奇数偶数<p>标签怎么设置不同的背景色。
<!DOCTYPE html>
<html>
<head>
<style>
p:nth-child(3n+0)
{
background:#ff0000;
}
</style>
</head>
<body> <h1>这是标题</h1>
<p>第一个段落。</p>
<p>第二个段落。</p>
<p>第三个段落。</p>
<p>第四个段落。</p>
<p>第五个段落。</p>
<p>第六个段落。</p>
<p>第七个段落。</p>
<p>第八个段落。</p>
<p>第九个段落。</p> <p><b>注释:</b>Internet Explorer 不支持 :nth-child() 选择器。</p> </body>
</html>
结果为:

last-child ,frist-child 都是css style 样式。 odd 奇数 even 偶数
css中 有' > '是什么意思。 表示的是从属关系,只有儿子辈的适用该样式,孙子辈的不适用该样式。
打个比方div span{...}这样写,div下的不论是儿子辈的span还是孙子辈的span都应用样式;
也就是说,div下的所有span都有这个样式。
div>span{...}这样写,div下的只有儿子辈的span应用样式;
但是如果是这种情况<span>dddddd<span>aaaaa</span></span>孙子辈的span会继承儿子辈的span样式;
试的时候这样<p><span>aaaaa</span><!--2--></p>才是真正的孙子辈样式
ie6不支持。
浏览器兼容模式。
-moz代表firefox浏览器私有属性
-ms代表IE浏览器私有属性
-webkit代表chrome、safari私有属性 css:border-width:10px 5px 20px 1px ******意思********
上边框,右边距,下边距,左边距。(顺时针)
9. 文字上下 居中 css样式:
vertical-align: middle
css 集锦。的更多相关文章
- CSS集锦
div内容自动换行:word-wrap:break-word;word-break:break-all;
- Matplotlib数据可视化(3):文本与轴
在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...
- CSS知识点集锦
CSS知识点集锦 CreateTime--2016年9月29日09:43:10Author:Marydon UpdateTime--2017年3月21日08:03:13 2.CSS样式优先级问题 ...
- CSS动效集锦,视觉魔法的碰撞与融合(二)
引言 长久以来,我认识到.CSS,是存在极限的.正如曾经替你扛下一切的那个男人,也总有他眼含热泪地拼上一切,却也无法帮你做到的事情,他只能困窘地让你看到他的无能为力,怅然若失. 然后和曾经他成长的时代 ...
- CSS特效集锦:视觉魔法的碰撞与融合(二)
引言 长久以来,我认识到.CSS,是存在极限的.正如曾经替你扛下一切的那个男人,也总有他眼含热泪地拼上一切,却也无法帮你做到的事情,他只能困窘地让你看到他的无能为力,怅然若失. 然后和曾经他成长的时代 ...
- CSS Hack技术介绍及常用的Hack技巧集锦
一.什么是CSS Hack? 不同的浏览器对CSS的解析结果是不同的,因此会导致相同的CSS输出的页面效果不同,这就需要CSS Hack来解决浏览器局部的兼容性问题.而这个针对不同的浏览器写不同的CS ...
- CSS效果集锦(持续更新中)
高亮光弧效果 使用CSS3实现的一个高亮光弧效果,当鼠标hover到某一个元素上时,一道光弧从左向右闪过,效果如下: 代码如下: <!DOCTYPE html> <html lang ...
- CSS 居中方法集锦
记录收集纯CSS层面实现的水平.垂直居中方法可用于块级.行内快.内联元素以及文字图片等. 水平或垂直居中 1.1 text-align 1.2 margin 1.3 line-height 1.4 p ...
- CSS 问题集锦
[1]让DIV中的内容居中 1.文字垂直居中,关键代码:height:100px;line-height:100px(两个值要相等) <div style="margin:0 auto ...
随机推荐
- laravel 目录结构
图 1.1 显示了 Laravel 项目目录结构是什么样子: 图1.1 Laravel 项目目录结构 就如你看到这样,laravel下面只包含了4个文件夹,这4个文件夹下面有一些子文件夹,这种丰富的子 ...
- ubuntu下搭建JAVA开发环境【转】
转自:http://jingyan.baidu.com/article/86fae346b696633c49121a30.html JAVA开发环境是一种跨平台的程序设计语言,可以在windows.L ...
- android:layout_gravity和android:gravity属性的区别
一.介绍: gravity的中文意思就是”重心“,就是表示view横向和纵向的停靠位置 (1).android:gravity:是对view控件本身来说的,是用来设置view本身的内容应该显示在vie ...
- App store 如何使用 promo code | app store 打不开精品推荐和排行榜
1. app store 如何使用 promo code: 在app store的 右下角精品推荐标签页,拉到最下面 点击“兑换” ,跳转到新的页面,输入兑换码,然后右上角“兑换”,程序开始自动下载并 ...
- [ios][swift]swift混编
http://blog.csdn.net/iflychenyang/article/details/8876542(如何在Objective-C的头文件引用C++的头文件) 1.将.m文件扩展名改为. ...
- android bluetooth蓝牙移植
http://blog.csdn.net/zhengmeifu/article/details/7705172 前段时间移植神念系统需要使用到bluetooth功能,现将移植过程中碰到的问题简要列一下 ...
- SQL-PIVOT 数据透视 行列转换
-- 数据透视 -- PIVOT: 行转列 SELECT * FROM ( SELECT N'张三' AS 姓名, N'语文' AS 课程,70 AS 分数 UNION SELECT ...
- 第十二届浙江省大学生程序设计大赛-Ace of Aces 分类: 比赛 2015-06-26 14:25 12人阅读 评论(0) 收藏
Ace of Aces Time Limit: 2 Seconds Memory Limit: 65536 KB There is a mysterious organization called T ...
- SHA1加密C#
//SHA1 static public string SHA1_Hash(string str_sha1_in) { SHA1 sha1 = new SHA1CryptoServiceProvide ...
- google prettify 代码高亮显示
引入js和css文件 下载地址 http://files.cnblogs.com/jaday/prettify.zip js文件代码 !function(){var q=null;window.PR_ ...