css 立体感のある水平线をCSSだけで実现する方法

Posted 2021-05-13

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了css 立体感のある水平线をCSSだけで実现する方法相关的知识，希望对你有一定的参考价值。

.selector {
  border-top: 1px solid #DDD;
  border-bottom: 1px solid #DDD;
  box-shadow: inset 0 1px 0 #FFF, 0 1px 0 #FFF;
}

.selector {
  border-bottom: 1px solid #DDD;
  box-shadow: 0 1px 0 #FFF;
}

/*
  http://daverupert.com/2011/06/two-tone-borders-with-css3/
*/

以上是关于css 立体感のある水平线をCSSだけで実现する方法的主要内容，如果未能解决你的问题，请参考以下文章