outline-offset

实在想不出来怎么只通过offset属性画十字架啊。。。

Pummbaa 2017-07-19

源自：CSS3用户界面 1-6 编程练习

收起

3回答

小丸子爱吃菜回答被采纳获得+3积分 2017-07-19 18:57:06

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        div{
            width: 100px;
            height: 100px;
            background-color: red;
            outline: 34px dotted #00ff00;
            
        }
    </style>
</head>
<body>
    <div></div>
</body>
</html>

你去看一下上面这个代码的效果，通过outline的设置将正方形的四个角所覆盖了，可以通过outline-offset对轮廓进行偏移，可以给它添加这个属性看看什么效果。

助学习愉快！

收起回答

Pummbaa 提问者 #1

哇，太厉害了，谢谢谢谢老师～

2017-07-19 19:26:33
Pummbaa 提问者 #2

但是还是无法弄成方的啊，我头都方啦，我太笨了。麻烦老师明示啊。。。。

2017-07-19 19:57:14

似水夕阳 2017-11-30 14:00:10

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
<title>Document</title>
<style>
div{
   width:48px;
   height:80px;
   background:red;
   margin:200px;
   outline-width:18px;
   outline-style:dashed;
   outline-color:white;
   outline-offset:-18px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

收起回答