<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.block{
background:skyblue;
height:60px;
width:60px;
position: relative;
border-radius: 10px;
} .block:before{
border-top-right-radius: 60px;
background: white;
position: absolute;
left: 0;
bottom: 0;
content: '';
display: block;
width: 20px;
height: 20px;
} .block:after{
border-bottom-left-radius: 60px;
background: white;
position: absolute;
right: 0;
top: 0;
content: '';
display: block;
width: 20px;
height: 20px;
}
</style>
</head> <body>
<div class="block"></div>
</body> </html>

  

div凹角实现的更多相关文章

  1. css实现div内凹角样式

    平常的开发中我们一般使用到圆角都是外凸的,即border-radius属性.而如果有内凹角的情况,我们一般的考虑实现方法有2种.一种是直接使用背景图片,一种是使用css. 用到的属性则是backgro ...

  2. IE6/7下空div占用空间的问题

    最近注意力没在前端上面,工作碰到这样一个问题,下意识的写了句 font-size:0;line-height:0;哪知道引发了更大的bug.后来插入数据进去的时候都不显示了..再后来百度一番找到,原来 ...

  3. div实现自适应高度的textarea,实现angular双向绑定

    相信不少同学模拟过腾讯的QQ做一个聊天应用,至少我是其中一个. 过程中我遇到的一个问题就是QQ输入框,自适应高度,最高高度为3row. 如果你也像我一样打算使用textarea,那么很抱歉,你一开始就 ...

  4. 冒泡,setinterval,背景图的div绑定事件,匿名函数问题

    1.会冒泡到兄弟元素么? $(function(){ $("#a").click(function(){alert("a")}) $("#b" ...

  5. css居中div的几种常用方法

    在开发过程中,很多需求需要我们居中一个div,比如html文档流当中的一块div,比如弹出层内容部分这种脱离了文档流等.不同的情况有不同的居中方式,接下来就分享下一下几种常用的居中方式. 1.text ...

  6. Div Vertical Menu ver5

    这个小功能,如果是算此次,已经是第5次修改了.可以从这里看到前4次:V1, http://www.cnblogs.com/insus/archive/2011/10/17/2215637.html V ...

  7. 计算Div标签内Checkbox个数或已被disabled的个数

    先看下面的html: 计算div内的checkbox个数:$('#divmod input[type="checkbox"]').length 计算div内checkbox被dis ...

  8. [jquery]显示隐藏div标签的几种方法

    1.$("#demo").attr("style","display:none;");//隐藏div $("#demo" ...

  9. CSS3变形记(上):千变万化的Div

    传统上,css就是用来对网页进行布局和渲染网页样式的.然而,css3的出现彻底打破了这一格局.了解过css3的人都知道,css3不但可以对网页进行布局和渲染样式,还可以绘制一些图形.对元素进行2D和3 ...

随机推荐

  1. Linux基础命令---free显示内存使用

    free free指令用来显示内存的使用情况,显示系统中可用和已使用的物理和交换内存的总量,以及内核使用的缓冲区.应该忽略共享内存列:它已经过时了. 此命令的适用范围:RedHat.RHEL.Ubun ...

  2. mysql数据库优化之索引的维护和优化

    这里是一个工具,即pt-duplicate-key-checker工具 用来检查重复及冗余的索引 用法如下:pt-duplicate-key-checker  -uroot  -p密码  -h127. ...

  3. leetcode 1——两数之和

    问题描述 给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整数,并返回他们的数组下标. 你可以假设每种输入只会对应一个答案.但是,你不能重复利用这个数组 ...

  4. 关于IIS的4月26日笔记

    常用命令: 31. regedit.exe----注册表 48. msconfig.exe---系统配置实用程序  80. services.msc---本地服务设置 93. regedit.exe- ...

  5. element-ui 2.4.3 如何实现对form部分字段验证的解决方法?

    这是实际项目中的一个例子: 新增人员信息功能: 必填:姓名 .电话(验证电话格式): 非必填:备注.微信.邮箱(验证邮箱格式) 必填验证: 邮箱格式验证: 今天偶然看到 element-ui 2.4. ...

  6. java枚举类型详解

      枚举类型是JDK1.5的新特性.显然,enum很像特殊的class,实际上enum声明定义的类型就是一个类.而这些类都是类库中Enum类的子类(java.lang.Enum<E>).它 ...

  7. Python使用LDAP做用户认证

    LDAP(Light Directory Access Portocol)是轻量目录访问协议,基于X.500标准,支持TCP/IP. LDAP目录以树状的层次结构来存储数据.每个目录记录都有标识名(D ...

  8. Yum安装时出现 The program yum-complete-transaction is found in the yum-utils package

    yum安装时出现 The program yum-complete-transaction is found in the yum-utils package yum之后,会显示上信息,并且最终执行结 ...

  9. LEETCODE 07 09

    最近忙着面试耽误了几天,今天刷了07,09都是字符串处理,一个是大数反转,一个是回文数判断,我都是转成字符串处理的,过了是过了,但是挺慢的,先记着,等有机会优化下 题目 给定一个 32 位有符号整数, ...

  10. mysql用户管理和pymysql模块

    一:mysql用户管理 mysql是一个tcp的服务器,用于操作服务器上的文件数据,接收用户端发送的指令,而接收指令时就 需要考虑安全问题. 在mysql自带的数据库中有4个表是用于用户管理的,分别是 ...