仅删除底部的textarea框阴影

Question

这就是我目前所拥有的：

我要做的是删除textarea（B，I和U上方的那个）的底部阴影，使它看起来像这样：

这是JSFiddle：http://jsfiddle.net/MgcDU/7616/

HTML：

<div class="editor span4">
  <textarea class="span4"></textarea>
  <ul class="format-post">
    <li><b>B</b></li>
    <li><i>I</i></li>
    <li><u>U</u></li>
  </ul>
</div>

CSS：

@import url('http://getbootstrap.com/2.3.2/assets/css/bootstrap.css');

body {
  margin: 10px;
}

textarea {
  border-radius: 2px 2px 0 0;
  border-bottom-color: #eee;
}

textarea:focus {
  border-bottom-color: #eeeeee;
}

textarea:focus + .format-post {
  border-color: rgba(82, 168, 236, 0.8);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 7px rgba(82, 168, 236, 0.6);
  transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
}

.format-post {
  list-style: none;
  background: #fafafa;
  height: 35px;
  border: 1px solid #cccccc;
  border-top: 0;
  border-radius: 0 0 2px 2px;
  margin: 0;
  margin-top: -10px;
}

.format-post li {
  width: 35px;
  height: 35px;
  border-right: 1px solid #eee;
  text-align: center;
  line-height: 33px;
  font-size: 14px;
  color: #333;
  cursor: pointer;
  display: inline-block;
}

请帮忙。

Answer 1

我刚刚将box-shadow更改为

box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 
0 -4px 7px rgba(82, 168, 236, 0.6);

它有效！ ：）

底色仍然是蓝色，所以我只是将其改为

border-bottom: 1px solid #999;

如果需要，您可以更改它！ ：）

这是小提琴：http://jsfiddle.net/afzaal_ahmad_zeeshan/MgcDU/7617/

对不起，我刚看到你想要textarea被染色，这不适合这个问题。你在标题中说要删除边框底部。但是作为回答，你们两个都有底线。

如果你想在textarea不活动时获取边框和所有动画，那么删除:focus它就能完成这项工作。

我仍然非常抱歉，因为我无法得到答案，所以应该回答问题或答案。