<!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. Spring boot 整合redis单机版

       一.安装redis 这个不多说,网上有各种系统安装redis的操作, redis安装 二.创建sprigboot项目 这个也不多说,不会的前面有相关教程. 三.添加maven坐标 四.编写spr ...

  2. 转载 USB固件分析

    http://1438431234.spaces.eepw.com.cn/articles/article/item/114022 0x00000000 0x0001fff0 大小 0x1fff1 = ...

  3. LNK2026 模块对于 SAFESEH 映像是不安全的

    解决方法如下: 配置属性 -> 链接器 -> 命令行 位置添加如下内容: /SAFESEH:NO

  4. HDU - 1907 John 反Nimm博弈

    思路: 注意与Nimm博弈的区别,谁拿完谁输! 先手必胜的条件: 1.  每一个小游戏都只剩一个石子了,且SG = 0. 2. 至少有一堆石子数大于1,且SG不等于0 证明:1. 你和对手都只有一种选 ...

  5. web前端研发工程师编程能力成长之路

    [背景] 如果你是刚进入WEB前端研发领域,想试试这潭水有多深,看这篇文章吧:如果你是做了两三年WEB产品前端研发,迷茫找不着提高之路,看这篇文章吧:如果你是四五年的前端开发高手,没有难题能难得住你的 ...

  6. openstack-ocata-网络服务5

    一. 网络服务概述 Networking(neutron),允许创建.插入接口设备,这些设备由其他的OpenStack服务管理.插件式的实现可以容纳不同的网络设备和软件,为OpenStack架构与部署 ...

  7. Linux(二)命令

    Linux命令一.命令基本格式 命令行头部显示字符意义 [root@localhost ~] # root 用户名 localhost 主机名 ~ 当前目录 ~表示home目录 # 用户权限,#表示超 ...

  8. 笔记︱基于网络节点的node2vec、论文、算法python实现

    看到一个很有意思的算法,而且腾讯朋友圈lookalike一文中也有提及到,于是蹭一波热点,学习一下.论文是也发KDD2016 . . 一.主要论文:node2vec: Scalable Feature ...

  9. Unable to find the ncurses libraries的解决办法

    我们在更新CentOS或者Ubuntu的内核时,执行make menuconfig可能看如这样的错误: *** Unable to find the ncurses libraries or the* ...

  10. 使用CXF和spring搭建webService服务

    虽然下一个项目需要使用xfire,但是在查资料的过程中还是看到有不少地方都说cxf比xfire更好,cxf继承了xfire,但是不仅仅包含xfire,因此便也一起来尝试尝试.大概是有了xfire的经验 ...