想拥有一个圆角矩形怎么办？
border - radius
border - radius: [<length> | <percentage> ] {1,4} [/[<length> | < percentage> ] {1,4} ] ?
前4个值表示x方向的半径 后面4个值表示y方向的半径
length : 距离 percentage：百分比
如果一个盒子的内容太多炒出来 ，我们该如何设置 ？
我们可以用overflow 这个属性
overflow
overflow : visible | hidden | scroll | auto
visible : 超出部分依然显示 默认
hidden ： 超出部分隐藏
scroll : 显示滚动条 管它内容多少
auto ： 内容少的时候不显示滚动条 内容多的时候才显示滚动条
当我们想把content-box 的 height broad设置为和 border-box 一样高 我们可以实用 box - sizing
box - sizing
box - sizing : content - box | border - box | inherit
content - box : 内容框
border - bo x ：边界框
——到这样的效果我们改怎么办____
box - shadow 盒阴影
box - shadow : none | <shadow> [ , <shadow> ] * shadow 可以是一个或者多个 可以设置多阴影
<shadow> : inset? && <length> { 2,4} && <color>?
\
box - shadow
这里的color没有设置 ，那默认值其实就是字体的颜色
在浏览器当中，如果没有设置边框的话，大部分元素的背景色都会融入到它父元素或者和它的睥睨元素一样的
如果我想区分它的边界美化它的轮廓我们可以 用 outline 属性
outline 宽度 格式 颜色
outline : [ < outline - width > || < outline - style > || <outline - color> ] | inherit
outline - width : <length> | thin | medium | thick | inherit
不常用的
outline - style : solid | dashed | dotted | ... | inherit
实线 虚线 点
outline - color ： <color> | invert | inherit
invert : 跟当前背景色相反 反色
原理
先说说我们在网页设计中常听的属性名：内容(content)、填充(padding)、边框(border)、边界(margin)， CSS盒子模式都具备这些属性。 这些属性我们可以把它转移到我们日常生活中的盒子（箱子）上来理解，日常生活中所见的盒子也就是能装东西的一种箱子，也具有这些属性，所以叫它盒子模式。每个盒子都有：边界、边框、填充、内容四个属性；
特点
每个属性都包括四个部分：上、右、下、左；这四部分可同时设置，也可分别设置；里的抗震辅料厚度，而边框有大小和颜色之分，我们又可以理解为生活中所见盒子的厚度以及这个盒子是用什么颜色材料做成的，边界就是该盒子与其它东西要保留多大距离。
结构
内容（CONTENT）就是盒子里装的东西； 而填充(PADDING)就是怕盒子里装的东西（贵重的）损坏而添加的泡沫或者其它抗震的辅料； 边框(BORDER)就是盒子本身了；至于边界(MARGIN)则说明盒子摆放的时候的不能全部堆在一起，要留一定空隙保持通风，同时也为了方便取出。在网页设计上，内容常指文字、图片等元素，但是也可以是小盒子（DIV嵌套），与现实生活中盒子不同的是，现实生活中的东西一般不能大于盒子，否则盒子会被撑坏的，而CSS盒子具有弹性，里面的东西大过盒子本身最多把它撑大，但它不会损坏的。 填充只有宽度属性，可以理解为生活中盒子每个HTML标记都可看作一个盒子；