详细解答参见上篇博客

问题1.如何用 div 画一个 xxx

box-shadow 无限投影 (堆叠成复杂图案）

::before

::after

问题2.如何产生不占空间的边框

1.box-shadow

2.outline

问题3.如何实现圆形元素（头像）

border-radius:50%

问题4.如何实现ios图标的圆角

1.将设计图形导入矢量设计软件导成 svg

2.用 clip-path：（svg）制作圆角图标

问题5.如何实现半圆、扇形等图形

border-radius 组合：1.有无边框 2.边框粗细 3.圆角半径

问题6.如何实现背景图居中显示/不重复/改变大小

background-position / background-repeat / background-size(cover/contain)

问题7.如何平移、放大一个元素(transform 跟动画没有关系）

transform:translateX(100px)

transform:scale(2)

问题8.如何实现3D效果

1.perspective:500px(指定透视角度大小）

2.transform-style:preserve-3d（选择3D效果，不然是2D效果）

3.transform:translate rotate（变换）

CSS效果常见问题的更多相关文章

  1. [转载] 高大上的 CSS 效果：Shape Blobbing

    这篇大部分是转载,来自<高大上的 CSS 效果:Shape Blobbing>和 <Shape Blobbing in CSS> 有部分是自己理解和整理,配合效果要做出 app ...

  2. CSS 效果汇总

    只要决心够, 就能征服痛苦. 把一些常用的 CSS 效果记录下来 1. 利用 z-index :hover 显示层 github 效果地址>> 此效果主要利用 a:hover 来改变 sp ...

  3. CSS效果：这里有你想要的CSS3漂亮的自定义Checkbox各种复选框

    在原来有一篇文章写到了<CSS效果篇--纯CSS+HTML实现checkbox的思路与实例>. 今天这篇文章主要写各种自定义的checkbox复选框,实现如图所示的复选框: 大致的html ...

  4. CSS效果篇--这里有你想要的CSS3漂亮的自定义Checkbox各种复选框

    在原来有一篇文章写到了<CSS效果篇--纯CSS+HTML实现checkbox的思路与实例>.这篇文章主要写各种自定义的checkbox复选框,实现如图所示的复选框: 大致的html代码都 ...

  5. 常见问题2：html+css效果综合整理

    1.---文本框提示文字颜色--placeholder属性 <input type="text" placeholder="请输入提示文字" /> ...

  6. CSS效果集锦（持续更新中）

    高亮光弧效果 使用CSS3实现的一个高亮光弧效果,当鼠标hover到某一个元素上时,一道光弧从左向右闪过,效果如下: 代码如下: <!DOCTYPE html> <html lang ...

  7. 几个简单实用的css效果

    1.要使按钮具有3D效果,只要将它的左上部分边框设置为浅色,右下部分边框设置为深色即可. eg:#button { background: #888; border: 2px solid; borde ...

  8. 一些常用的html/CSS效果---小技巧

    我常用的重置样式表reset.css /*===============基础信息================*/ *{border: 0;padding: 0;margin: 0;} table ...

  9. 问题：贴友关于CSS效果的实现

    今日在百度贴吧中,一贴有提出如下问题: 对于这个问题,咱们贴上代码看效果 1: <html> 2: <head> 3: <meta http-equiv="co ...

随机推荐

  1. shell里的IFS内置环境变量

    IFS 的全称是 Interal Field Separator ,即“内部区域分隔符”,它也是一个内置环境变量,存储着默认的文本分隔符,默认下这分隔符是空格符(space character),制表 ...

  2. AJPFX深入理解之abstract class和interface的区别

    含有abstract修饰符的class即为抽象类,abstract 类不能创建的实例对象.含有abstract方法的类必须定义为abstract class,abstract class类中的方法不必 ...

  3. html学习笔记-DOM

    html学习笔记-DOM Table of Contents 1. 什么是 DOM? 2. DOM 节点 3. DOM 方法 4. DOM 属性 5. DOM 访问 6. DOM 修改 7. DOM ...

  4. 带你零基础入门redis【二】

    本篇文章介绍redis如何设置开机自启动以及如何在java中应用 一.设置redis开机自启 1.修改redis配置 [root@VM_6_102_centos ~]# vim /usr/local/ ...

  5. Outlook 0x800CCC1A 错误

    使用POP3帐户时,您可能在Outlook 2013/2016中看到以下错误.我在Exchange Server 2013环境中遇到此问题,在Windows 8.1上运行的Microsoft Outl ...

  6. Python+selenium之selenium Grid2

    利用selenium grid2 keyi可以在不同的主机上建立主节点(hub)和分支节点(node),可以使主节点上的测试用例在不同的分支节点上运行.对不同的节点来说,可以搭建不同的测试环境(操作系 ...

  7. MATLAB中容易忽略却经常遇到的小技巧总结

    1       如何产生一个列向量相同的矩阵 例如,列向量x=[1;2;3],要产生矩阵A=[x,x,x],即[1,1,1;2,2,2;3,3,3]. A = repmat(x,1,n) 2      ...

  8. Spark Job调优(Part 2)

    原文链接:https://wongxingjun.github.io/2016/05/11/Spark-Job%E8%B0%83%E4%BC%98-Part-2/ 这篇文章将会完成Part 1中留下的 ...

  9. FreeRTOS_信号量

    FreeRTOS信号量 信号量是操作系统总重要的一部分,信号量一般用来进行资源管理和任务同步,FreeRTOS中信号量又分为二值信号量.计数型信号量.互斥信号量和递归互斥信号量.不同的信号量其应用场景 ...

  10. vue 修改端口