1.css 面试题:

css 组成:

css 样式组成
规则:选择器+声明块 声明块:css属性+css属性值

 2.css 解析规则:

  从右往左

3.文字超出省略号显示:

1.元素不是内联块
2.overflow:hidden
3.text-overflow:ellipsis;

4.表单伪类

disabled  enabled  checked(自定义单选) focus

5.结构伪类

:nth-child(index)         找到某类index个子元素
:nth-of-type(index) 找到index个子元素 以元素为中心

6.高斯模糊:

<div class="bg">
<img src="/static/demo.jpg" class="test-img">
</div

  

/* 外层椭圆形状,内层图片只能在椭圆区域展示 */
.bg{
position: relative;
left: -10%;
width: 120%;
height: 130px;
border-radius: 0 0 80% 80%;
overflow: hidden;
}
/* 内层显示的图片 */
.bg img{
width: 100%;
height: 100%;
filter: blur(20px);
overflow: hidden; }

  7.文字阴影

text-shadow: h-shadow v-shadow blur color;

          h-shadow:必需。水平阴影的位置。允许负值。

          v-shadow:必需。垂直阴影的位置。允许负值。

          blur:可选。模糊的距离。

          color:可选。阴影的颜色。

  8.框阴影

box-shadow: h-shadow v-shadow blur spread color inset;

h-shadow	必需。水平阴影的位置。允许负值。
v-shadow 必需。垂直阴影的位置。允许负值。
blur 可选。模糊距离。
spread 可选。阴影的尺寸。
color 可选。阴影的颜色。请参阅 CSS 颜色值。
inset 可选。将外部阴影 (outset) 改为内部阴影。

  


css3 属性的更多相关文章

  1. 如何处理CSS3属性前缀

    今天闲来无聊,重新来说说CSS3前缀的问题.在春节前和@一丝姐姐说起Sass中有关于gradient的mixins.姐姐说: 为什么还要用mixin呢?为什么不使用Autoprefixer?使用Aut ...

  2. CSS3属性 box-shadow 向框添加一个或多个阴影

    CSS3属性 利用box-shadow制作网页页眉背景 box-shadow 浏览器支持 IE9+.Firefox 4.Chrome.Opera 以及 Safari 5.1.1 支持 box-shad ...

  3. CSS3属性transform详解之(旋转:rotate,缩放:scale,倾斜:skew,移动:translate)

    CSS3属性transform详解之(旋转:rotate,缩放:scale,倾斜:skew,移动:translate)   在CSS3中,可以利用transform功能来实现文字或图像的旋转.缩放.倾 ...

  4. 让IE6/IE7/IE8浏览器支持CSS3属性

    让IE6/IE7/IE8浏览器支持CSS3属性 一.下载 您可以狠狠地点击这里:ie-css3.htc,这个玩意儿是让IE浏览器支持CSS3表现的关键东东. 二.上面的是什么东西 首先说说.htc文件 ...

  5. 实用的CSS3属性和使用技巧

    CSS可以改进网站的设计并且开拓网站设计更多的可能性,可以令你的网页更具吸引力.对于前端开发者.网站设计师来说,掌握并熟练应用CSS是一项必不可少的技能. 下面列出了一些非常实用的CSS3属性和使用技 ...

  6. H5、CSS3属性的支持性以及flex

    一.项目中用到一个flex属性,但是应用了flex的父容器只设置了width,没有设置height,此时每一个应用了上面提到的属性的样式的div都重叠在了一起,在IE10,IE11出问题,IE9没有问 ...

  7. 移动端 几个css3属性的练习

    转行做前端,上班有一个星期了,什么都不懂,今天学习了几个新的css3属性,记录下来. 注:所有的测试均是在chrome上手机模式测试,与真实的手机环境可能有误差 1:-webkit-tap-heigh ...

  8. 【原】常见CSS3属性对ios&android&winphone的支持

    2个月前,我在博文<webapp开发中兼容Android4.0以下版本的css hack>中写过“那对于做移动网页开发的同事来说,一般只要做好webkit内核浏览器的展现效果就行了” ,在 ...

  9. CSS3属性border-radius绘制多种多样的图形

    border-radius,国内翻译成圆角,你可能以为这个属性就是用来画圆角,没错,但是除此之外,它还可以做点别的事情.radius其实指的是边框所在圆的半径,这个CSS3属性不仅能够创建圆角,还可以 ...

  10. [css]需警惕CSS3属性的书写顺序

    转载张鑫旭:http://www.zhangxinxu.com/wordpress/2010/09/%E9%9C%80%E8%AD%A6%E6%83%95css3%E5%B1%9E%E6%80%A7% ...

随机推荐

  1. [再寄小读者之数学篇](2014-06-20 求极限-L'Hospital 法则的应用)

    设 $f\in C[0,+\infty)$, $a$ 为实数, 且存在有限极限 $$\bex \vlm{x}\sez{f(x)+a\int_0^x f(t)\rd t}. \eex$$ 证明; $f( ...

  2. [物理学与PDEs]第1章第9节 Darwin 模型 9.3 Darwin 模型

    1. $\Omega$ 中 ${\bf A}={\bf A}_T+{\bf A}_L$, 其中 $\Div{\bf A}_T=0$, $\rot{\bf A}_L={\bf 0}$. 若 $$\bex ...

  3. postfix - SPF 防发件人欺骗

    安装 perl 依赖: yum install perl-Mail-SPF perl-Sys-Hostname-Long 下载 SPF 插件工具: wget https://launchpad.net ...

  4. luogu P5293 [HNOI2019]白兔之舞

    传送门 关于这题答案,因为在所有行,往后跳到任意一行的\(w_{i,j}\)都是一样的,所以可以算出跳\(x\)步的答案然后乘上\(\binom{l}{x}\),也就是枚举跳到了哪些行 如果记跳x步的 ...

  5. error: no matching function for call to 'std::exception:exception(const char[16])'

    环境:codeblocks 语言:C++ 在执行:throw new exception("queue is empty.");时 遇到问题:error: no matching ...

  6. npm——安装教程、安装vue脚手架

    npm:是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题.比如常用的有: 1)允许用户从NPM服务器下载别人编写的第三方包到本地使用. 2)允许用户从NPM服务器下载并安 ...

  7. C# 微信开发-----微信会员卡(三)激活会员卡

    在会员领取了会员卡之后需要做 一个跳转性激活,模式请看下图: 在创建会员卡的时候需要配置下这个参数的值: memberActivate.aspx页面代码如下: <%@ Page Language ...

  8. myeclipse安装spring插件

    1.查看 myeclipse 中的 eclipse 对应的版本 2.下载对应eclipse的 spring 插件 首先要安装spring插件,可以到spring官网下载  地址(https://spr ...

  9. vue中html模板使用绑定的全局函数

    我们知道在script中使用vue绑定的全局函数时, 我们需要用这种方式使用: this.Util.Fun(e) 那在模板中, 比如v-if中想使用Fun函数怎么办呢?你应该这样做 <i v-i ...

  10. django请求生命周期,FBV和CBV,ORM拾遗,Git

    一.django 请求生命周期 流程图: 1. 当用户在浏览器中输入url时,浏览器会生成请求头和请求体发给服务端请求头和请求体中会包含浏览器的动作(action),这个动作通常为get或者post, ...