CSS Outset/Inset,边框和轮廓

Nag*_*nke 8 html css jquery css3

两者之间究竟有什么区别CSS outset,inset,border and outline.
真的很喜欢这个,什么属性可以一起应用.
哪些浏览器支持上述哪些属性?
以上属性的简短示例将是好的.

谢谢

Ark*_*ana 21

边界和大纲的差异

边框:边框边缘围绕框的边框.它的面积计算了盒子模型的总大小.您可以为四个可能的边框(顶部,右侧,底部和左侧)指定size(border-width),color(border-color)和style(border-style).您可以在此处检索有关边框属性的更多信息.

轮廓:类似于边框,但在这种情况下不占用空间,与之相对border.此外,您不能单独设置每个边框的样式,轮廓样式适用于框的所有四个边.Outline可以和border.一起使用.您可以申请轮廓属性是outline-color,outline-styleoutline-width 你能得到关于轮廓属性的详细信息在这里.

这是一个代表outline和的盒子模型border 在此输入图像描述

边框风格:插图和开头

插图:这是一种边框式.边框使框看起来好像嵌入在画布中.您可以使用此border-style范围内border-colorborder-width.

插入边框不同的浏览器

一开始:另一种边境风格.与'inset'相反:边框使框看起来好像是从画布中出来的.您可以使用此border-style范围内border-colorborder-width.

开始边框不同的浏览器

文档和来源