css1-css3的那些模糊点
css很重要, 但也不是万能的, 也不能抛弃dom 元素和 元素的属性!! 很多时候, dom "元素" 的 "属性" 也很重要 也很实用! 要结合属性来写
包括很多的html 元素标签, 也不能弃而不用, 只用div, p span等还是不行的!!
在css中和dom属性的写法: 只说标准的: css中单词和单词的连接用 - , 不用下划线 _ , dom元素的属性一般用双引号.
css的颜色, 可以用三个字符来表示, css是支持 颜色的 简写 的! 但是html中 , 关于属性颜色, 是不能简写的, 必须写完整.
在第一个图中, 说default: not specified, 说没有设置, 其实就是: background设为transparent, 其实就是它的 默认背景颜色
- 通常情况下, 设置与不设置都没有关系/没有区别;
- 但是, 有两种情况, 需要设置, 一是当两个重叠的div, 想要显示被隐藏的下面的那个div, 就要 (用代码) 把上面那个div的背景颜色设为透明;
- 第二种情况是: 要设置某些边框border的特殊(效果)样式时, 如inset, outset, groove, ridge时, 就可以设置边框的背景为透明...
注意: 边框颜色一般不设置为 "透明" , 那就显示不出边框了. 一般设置 inset, outset就可以了, 因为groove和ridge的效果跟inset同 和 outset基本相同.一般使用细线为1px就好了.
inset和outset的效果, 主要是 显示在 "右下"的边框线, 包括颜色, 一般 "左手"的边框线都不会变得.
要设置竖直细线, 可以使用边框和padding margin相结合. 这时只显示 border-right就好了..
推而广之, 以后凡是页面中 "!所有!" 的线: 边框 , 水平线, 竖直线, 分隔线, 分割线等等, 都可以通过 border-direction 加 padding来实现的!!
box-shadow,注意不是border-shadow,
-moz-box-shadow: 10px 10px 5px #888888; /* 老的 Firefox */
box-shadow: 5px 10px 5px #eaf;
实际上box-shadow的实现, 还是在后下方 再绘制了 一个矩形.
5px 10px表示 "阴影" 矩形 跟原来div box之间的水平和垂直 偏移;
5px 表示 阴影"逐渐过度的" 距离. 后面的颜色表示阴影的颜色.
不过 box-shadow 是css3的样式...
-webkit... 和 -moz-box-shadow 成为浏览器的 私有 前缀, 表示的是 厂商自己先实现某些功能样式, 而w3c的标准推进是比较慢的, 所以 等今后标准创建好了, 再取消前缀...
css1-css3的那些模糊点的更多相关文章
- css3的滤镜模糊的效果
最近在做一个css3的滤镜模糊的效果,但是我发现,有些浏览器一点效果都没有,这是浏览器兼容性导致的,怕今后会忘记所以就先写下来,也希望可以帮到需要的小伙伴. 代码如下: div{//设置半透明滤镜效果 ...
- CSS3 新增的文本属性
一.CSS1&2中的文本属性(W3C标准) text-indent CSS1 检索或设置对象中的文本的缩进 letter-spacing CSS1 检索或设置对象中的文字之间的间隔 word- ...
- CSS3总结三:文字(text)/字体、文本、文本装饰、多列
Text-Decoration text-shadow text-decoration Font font font-face Text 常用Text属性 Multi-column Multi-col ...
- 本周推荐7款CSS3实现的动态特效
大家都知道,在网页制作时使用CSS技术,可以有效地对页面的布局.字体.颜色.背景和其它效果实现更加精确的控制.只要对相应的代码做一些简单的修改,就可以改变同一页面的不同部分,或者页数不同的网页的外观和 ...
- CSS3常用新特性
CSS3的新特性 新增CSS3特性有兼容性问题,ie9+才支持 移动端支持优于PC端 新增选择器和盒子模型以及其他特性 CSS新增选择器 属性选择器 属性选择器可以根据元素特定属性来选择元素,这样就可 ...
- css文本属性
CSS1&2中的文本属性 属性 版本 简介 text-indent CSS1 检索或设置对象中的文本的缩进 letter-spacing CSS1 检索或设置对象中的文字之间的间隔 word- ...
- HTML, CSS学习笔记(完整版)
第一章 div布局 前几课内容 .htm是早期的后缀.由于那时仅仅能支持长度为3的后缀.因此html与htm是一样的. shtml是server先处理然后再交给浏览器处理 #HTML小知识#之#XHT ...
- jQuery系列 第四章 jQuery框架的选择器
第四章 jQuery框架的选择器 4.1 jQuery选择器说明 jQuery 最核心的组成部分就是选择器引擎.它完全继承了 CSS 的风格,可以对 DOM 元 素的标签名.属性名.状态等进行快速准确 ...
- 2019-4-26 css学习笔记
CSS简介:Cascading Style Sheets(层叠样式表)的缩写,它是一种用来表现HTML或XML等文件样式的计算机语言. CSS的作用:是定义网页外观(例如,字体.背景.文本.位置.布局 ...
- jQuery 运行机制
1.Selector,查找元素.这个查找不但包含基于CSS1~CSS3的CSS Selector功能,还包含其对直接查找或间接查找而扩展的一些功能. 2.Dom元素的属性操作.Dom元素可以看作htm ...
随机推荐
- 【BZOJ-2892&1171】强袭作战&大sz的游戏 权值线段树+单调队列+标记永久化+DP
2892: 强袭作战 Time Limit: 50 Sec Memory Limit: 512 MBSubmit: 45 Solved: 30[Submit][Status][Discuss] D ...
- 【BZOJ-1500】维修数列 Splay
1500: [NOI2005]维修数列 Time Limit: 10 Sec Memory Limit: 64 MBSubmit: 11047 Solved: 3460[Submit][Statu ...
- 洛谷P1460 健康的荷斯坦奶牛 Healthy Holsteins
题目描述 农民JOHN以拥有世界上最健康的奶牛为傲.他知道每种饲料中所包含的牛所需的最低的维他命量是多少.请你帮助农夫喂养他的牛,以保持它们的健康,使喂给牛的饲料的种数最少. 给出牛所需的最低的维他命 ...
- FT232RL变砖之后
FT232RL是个是神奇的片子,说万能可能有些夸张,但是...总之就是FTDIChip这个神奇的公司基于类似的技术,做了很多好用的产品,包括转IIC啦,转SPI啦,密码狗啦之类的.是个很有用的工具就对 ...
- django1.8 提示(1_8.W001) The standalone TEMPLATE_* settings were deprecated in Django 1.8 and the TEMPLATES dictionary takes precedence. You must put the values of the following settings into your defau
原因是升级之后不推荐使用单独的 TEMPLATES_DIR这样的设置了,使用TEMPLATE = []这种就好了 详细见https://openedx.atlassian.net/browse/TNL ...
- 第一个python程序-判断登陆用户名和密码是否正确
#setencoding=utf-8 #用户名和密码输入正确,则登陆成功 #用户名正确密码错误,只再输入密码,有3次机会 #错误3次,则把用户名放入lock中 import os,sys #存放用户名 ...
- Linux上性能异常定位以及性能监控
引言:大多数的服务都是跑在Linux上的,Linux现在也已经到了一个很广泛的应用,但是仍然会有很多问题出现,我们就来讨论下我们性能监控的指标,性能监控无非就是从I/O,内存,CPU,TCP连接数,网 ...
- python编码
一.编码 常见的编码比较: ascii:1个字节 unicode:2个字节 utf-8:英文1个字节,汉字3个字节 二.一个编码问题 问:如下代码设置了在代码中添加了coding: utf-8,但是在 ...
- iOS - 装饰对象
1.设计模式原则 多组合,少继承 类对拓展开放,对修改关闭 派生的子类接口是在编译时就静态决定的,而所有子类都会继承到相同的接口.然而,利用组合或者说装饰模式来拓展抽象类的接口,就可以在运行时动态的进 ...
- BZOJ2186: [Sdoi2008]沙拉公主的困惑
传送门 常规数论题,利用欧拉函数的相关性质. 题求$[1,N!]$中与$M!$互质的数的个数,且$M \leq N$.然后根据欧拉函数的相关性质很容易得出这道题的答案为$\frac{\phi (M!) ...