使用外部示例的CS冲突

在样式表中创建自定义css,然后在它们下面添加a和li的样式。

例如:

.container a {
    // insert styles
   }
.list{
   // insert styles
  }
.item{
   // insert styles
   }

在你的html中

<div class="container">
  <a class="link"></a>
 <ul class="list">
   <li class="item"></li>
   <li class="item"></li>
   <li class="item"></li>
 </ul>
</div>

在加载示例CSS后,您必须通过加载自己的CSS来覆盖不需要的样式(如li和a)。

比如:

<link rel="stylesheet" href="codepen.css" />
<link rel="stylesheet" href="youroverwrites.css" />

如果这还不够,请使用!重要的选择。在你自己的css中(必须在codepen css之后加载),使用这样的东西:

li { border:red !important };

重要的是:在从codepen导入的内容之后加载自己的CSS。就这么简单。