CSS的box-shadow创建边框
最常见的用法:
box-shadow : x轴偏移 y轴偏移 颜色
如果提供第三个和第四个可选值
box-shadow : x轴偏移 y轴偏移 模糊半径 扩散半径 颜色
内阴影:inset(可选值)
因为box-shadow
本来用于展现阴影,因此可以有外阴影和内阴影
box-shadow : x轴偏移 y轴偏移 模糊半径 扩散半径 颜色 inset
栗子一:
下面这个输入框非常常见:
<form action="">
<input type="text" placeholder="有什么话要说?">
</form>
<style>
input {
width: 100px;
border: none;
outline: none;
border-bottom: 1px solid #3797a4;
padding-bottom: 10px;
}
</style>
我们打算需要输入内容的时候显示边框以提醒用户:
input {
width: 100px;