CSS Box-Shadow在Webkit中不使用Textarea

前端之家收集整理的这篇文章主要介绍了CSS Box-Shadow在Webkit中不使用Textarea前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这个简单的代码无法在Chrome或Safari中使用…
<!DOCTYPE HTML>
<html>
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>
<style>
:required {Box-shadow:0 0 5px red;}
</style>
<body>
<form>
<textarea required></textarea>
</form>
</body>
</html>

它在Firefox和Opera中运行得很好.另外,border:1px solid red在webkit浏览器中运行得很好.这是怎么回事?我甚至试过textarea {display:block;}认为它可能是一个内联问题.

解决方法

你需要添加
-webkit-appearance: none;

强制令人敬畏的webkit渲染textarea作为普通块并应用你编写的所有CSS.

See jsfiddle

猜你在找的CSS相关文章