CSS-CSS3 Safari风格工具栏按钮圆形框阴影按下边框半径Moz，Firefox，K

Posted 2021-02-25

/**
 * Author: Chris Morrell <http://cmorrell.com/>
 * Version: 1.1
 * 201008051349 - brandonjp - modified for moz, khtml, css3
 *
 * from http://cmorrell.com/safari-extensions
 *
 * You may use this file any way you see fit.
 *
 */
 
a, button {
	color: #282828;
	font-weight: bold;
	text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.4);
	text-decoration: none;
	padding: 1px 7px 2px;
	display: inline-block;
	border-radius: 8px;
	cursor: default;
	border: none;
	background: none;
}
 
a:hover, button:hover {
	color: #fff;
	text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.4);
	background: rgba(0, 0, 0, 0.21);
}
 
a:active, button:active, a.toggled, button.toggled {
	color: #fff;
	text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.4);
	box-shadow: inset
		0 1px 2px rgba(0, 0, 0, 0.5),
		0 1px 1px rgba(255, 255, 255, 0.8);
	-moz-box-shadow: inset
		0 1px 2px rgba(0, 0, 0, 0.5),
		0 1px 1px rgba(255, 255, 255, 0.8);
	-khtml-box-shadow: inset
		0 1px 2px rgba(0, 0, 0, 0.5),
		0 1px 1px rgba(255, 255, 255, 0.8);
	-webkit-box-shadow: inset
		0 1px 2px rgba(0, 0, 0, 0.5),
		0 1px 1px rgba(255, 255, 255, 0.8);
}
 
a.toggled, button.toggled {
	background: rgba(0, 0, 0, 0.35);
}
 
a:active, button:active {
	background: rgba(0, 0, 0, 0.49);
}