<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<style>
div::after {
content: ''
display: inline-block
width: 200px
height: 200px
border: 1px dashed #ccc
}
</style>
<body>
<div></div>
</body>
</html>
不知道为啥没有代码格式
---------
需要注意：
1. content属性很重要，如果没有内容，记得给个空
2. 默认伪类是inline属性，设置不了高宽。如需设置，改变为inline-block，block等都可以
VE Super FrameVE Super Frame 是一款利用九宫格缩放技术来为图层添加边框的After Effects插件。VE Super Frame使用时需要输入两个图层，一个是内容图层，一个是边框图层。设置完成后VE Super Frame会自动将边框图层的内容添加到内容图层周围作为边框。搜索VE Leap,这是一个AE设计师的集中地，里面有超多AE相关插件和教程，可以免费下载
表格的边框分为3个元素决定：table,th,td
如果三种元素全部设置了border样式，那么会发现外层有2层border,里面的th与th，td与td,td与th之间的border也是有2层的，所以，在设置border之前最好先想好通过什么样的规则来展现boeder(因为方式很多，那么我们只能选择适合自己的-也就是用的习惯的)。另外，表格之间还有一个概念是表空间,可以通过给表格设置样式table{ border-collapse:collapse border-spacing:0}清除这些多余的空间，那么有了上面的准备工作之后，下面就开始border样式的设置--代码如下：
td,th{
border-bottom: 1px solid #e3e3e3//xia下边框
border-right:1px solid #e3e3e3//有边框
}
那么你可以得到效果：
少了左边和上边，接下来就可以根据浏览器的兼容性选择分支：
直接table{
border-top: 1px solid #e3e3e3
border-left: 1px solid #e3e3e3
}
简单粗暴
2.
td:first-child,th:first-child{
border-left: 1px solid #e3e3e3
}
th{
border-top: 1px solid #e3e3e3}
这个方法有兼容性问题，因为涉及到伪类的:first-child，所以IE7是无效的。
于是效果就如下了：
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）