<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
div{
width:300px;
height:300px;
border:solid 1px red;
border-top-left-radius:20px;
border-top-right-radius:30px;
border-bottom-left-radius:30px;
border-bottom-right-radius:40px;
box-shadow:10px 10px 10px yellow;
}
</style>
</head>

<body>
<div></div>
</body>
</html>

画一个DIV并给它的四个角变成圆形，且加上阴影的更多相关文章

  1. JavaScript高级 面向对象（1）--添加一个div标签

    说明(2017.3.28): 1. JavaScript是一种基于对象的多范式编程语言,不是面向对象,但离开对象不能活. 范式编程是指编程习惯.方式,分为过程式.对象式和函数式编程. 2. 面向对象是 ...

  2. 如何用css画一个彩虹---v客学院技术分享

    无意间看到了CSS radial-gradient() 函数实现了如下图的样式 仔细一看还真有点像灯光下的鸡蛋,O(∩_∩)O哈哈~ 今天我就来用radial-gradient()函数教大家画一个简单 ...

  3. 用css控制一个DIV画图标。

    在实际开发中,我们会用到一些小图形,图标.大多数情况下都是用图片来实现的,同时对图片进行处理使图片大小尽可能的缩小.但是图片在怎么处理也是按KB来算的.但是要是用CSS画,只要用很少的空间就能完成同样 ...

  4. div+css画一个小猪佩奇

    用DIV+CSS画一个小猪佩奇,挺可爱的,嘻嘻. HTML部分(全是DIV) <!-- 小猪佩奇整体容器 --> <div class="pig_container&quo ...

  5. 一个页面多图表展示（四个div的方式）

    效果如图所示,一个页面四个div,每个div里面展示相应的数据,因为这种效果会有点麻烦,而且不太雅观我就换了一种写法,一个div里面用四个图表,共用一个图例,先放上这个方式的效果图和源码,后期会再发布 ...

  6. Effective前端3：用CSS画一个三角形

    p { text-indent: 2em } .triangle-container p { text-indent: 0 } img { margin: 15px 0 } 三角形的场景很常见,打开一 ...

  7. css3简单几步画一个乾坤图

    原文:[原创]css3简单几步画一个乾坤图 效果如上,鼠标移上去会有动画. 代码如下非常简单: <html> <head> <style> .outer{heigh ...

  8. Effective前端1---chapter 2 用CSS画一个三角形

    1.CSS画三角形的画法 第一步:三角形可以用border画出来,首先一个有四个border的div长这样: <div class="triangle"></di ...

  9. Effective前端(3)用CSS画一个三角形

    来源:https://zhuanlan.zhihu.com/p/26160325 三角形的场景很常见,打开一个页面可以看到各种各样的三角形: 由于div一般是四边形,要画个三角形并不是那么直观.你可以 ...

随机推荐

  1. 解决Macbook网络连接成功但是图标一直显示正在查找网络问题

    看图,一直显示正在连接网络..明明连接上去了,解决办法,打开网络偏好设置 新建位置 然后点击应用就搞定了 图标正常了

  2. Nginx下编译PHP+Mysql

    先说一下PHP在Apache和Nginx下所扮演的角色 apache一般是把php当做自己的一个模块来启动的. 而nginx则是把http请求变量(如get,user_agent等)转发给 php进程 ...

  3. Oauth认证协议

    原文地址腾讯QQ第三方登录的实现原理? Oauth当中的角色: 1.Service Provider(服务提供方): 服务提供方通常是网站,在这些网站当中存储着一些受限制的资源,如照片.视频.联系人列 ...

  4. UVA - 10723 类似LCS

    思路:dp(i, j)表示第一个串前i个字符和第二个串前j个字符需要的最短字符串长度,cnt(i, j)表示第一个串前i个字符和第二个串前j个字符需要的最短字符串的个数. 转移方程: if(s1[i] ...

  5. CodeForces-731A

    每次找到最短距离,然后更新指针的位置. AC代码: #include<cstdio> #include<cmath> const int maxn=100+5; char s[ ...

  6. CodeForces-749A

    要求组成n的素数最多,根据n的奇偶讨论:如果n是偶数,直接打印n/2个数字'2'就可以了:如果n是基数,则先打印一个'3',再打印(n-3)/2个数字'2'就可以了. AC代码: #include&l ...

  7. STL中坑爹的max函数

    hdu1754永远难忘的痛,参数最好不要传耗时特别长的函数,因为会调用两次,如果是递归的话,不知道多少次呢.. 切记!切记!切记! 例如: //return max(getAns(root<&l ...

  8. 叼叼叼，HTML5日期(Date)类型和文本(Text)类型互相转换

    <input placeholder="From" class="form-control" type="text" onfocus= ...

  9. JVM笔记3-java内存区域之运行时常量池

    1.运行时常量池属于线程共享区中的方法区. 2.运行时常量池用于编译期生成的各种自变量,符号引用,这部分内用将在类加载后接入方法区的运行时常量池中存放. 看如下代码所示,如图: public clas ...

  10. Tcpdump安装使用

    本来想安装wireshark yum install wireshark  命令行下使用,包含抓包的基本功能 yum install wireshark-gnome  提供wireshark(UI)工 ...