求CSS大神，图中这个边框怎么做出来
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了求CSS大神，图中这个边框怎么做出来相关的知识，希望对你有一定的参考价值。
带箭头的边框，好像需要旋转，不是很会，求大神
思路：一个矩形，一个正方形，将正方形的边框去掉两边，留两边，这样就形成了一个打开的三角形，然后旋转打开的三角形，利用相对定位移动到矩形右侧，接着将正方形的背景颜色设置白色，覆盖矩形右侧边框。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>demo</title>
<style>
body>div
width: 300px;
height: 200px;
border: 1px solid red;
padding: 10px;
/* 矩形 */
#rectangle
width: 80px;
height: 20px;
border: 1px solid #CEEBD4;
float: left;
padding: 5px 0 5px 10px;
color: #808280;
/* 三角形 */
#triangle
width: 15px;
height: 15px;
border-left: 1px solid #CEEBD4;
border-bottom: 1px solid #CEEBD4;
float: left;
position: relative;
left: -8px;
top: 8px;
background-color: white;
/* 旋转 */
-webkit-transform: rotate(-135deg);
</style>
</head>
<body style="padding:100px;">
<div>
<div id="rectangle">扫码登录</div>
<div id="triangle"></div>
</div>
</body>
</html>
打开浏览器，访问该文件，效果如下图：
直接裁剪不就ok了，哪里这么麻烦，就是一个长方形，然后裁剪一下就ok了，别去搞什么旋转，越高头越大。你这个形状裁剪就是这样的：
-webkit-clip-path: polygon(81% 0, 81% 31%, 100% 55%, 79% 77%, 79% 100%, 0 100%, 0 0);clip-path: polygon(81% 0, 81% 31%, 100% 55%, 79% 77%, 79% 100%, 0 100%, 0 0);
大概就是这么个意思，裁剪，搞几个坐标就ok了。有现成的裁剪工具可以用。
安卓版OneNote 我做的笔记同步不出来，里面有好多张图片，求大神支招怎
安卓版OneNote
我做的笔记同步不出来，里面有好多张图片，求大神支招怎么才能打开我以前做的笔记
1. 用电脑登录skydrive，点击OneNote 就在新建文件的左边 office软件图标最右边的一个，打开后直接按后退键，当然你也可以重命名这个笔记本，默认名字为逗笔记本1地
注：这里新建的onenote其实不是文档 是一个大的分类可以理解为文件夹
2. 手机进入office，在逗位置地中选择skydrive地，进入skydrive找到刚才新建的逗笔记本1地，打开后会自动同步到手机
3. 返回到手机中的笔记，点击最下方三个图标中中间的笔记本图标，可以看到刚才新建的逗笔记本1地，另外一个是系统默认逗个人(web)地，打开逗笔记本1地，长按逗无标题分区地（未重命名）名字忘了不过这里只有一个文件，选择逗设为默认值地，ok解决了
此时你可以尝试用手机新建一个笔记，可以自动同步到skydrive，设置完之后可以把逗个人(web)地删除，如果觉得碍眼的话
以上是关于求CSS大神，图中这个边框怎么做出来的主要内容，如果未能解决你的问题，请参考以下文章
鼠标放到图片上会出现一个亮亮的边框是怎么做出来的，求代码，我个人觉得是否用到jquery了