不需要的jquery-ui-1.8.9.custom.css出现了

Question

我尝试创建一些简单的标签来更好地整理内容。当代码从我的桌面运行时，它可以正常工作，但是当它放在打击乐器的CMS中时，样式就会关闭。在使用Chrome的检查元素工具时，我发现有一个影响我的样式的jquery-ui-1.8.9.custom.css文件。我没有在我的代码的标题部分链接到此文件。关于在打击乐器中跑步时这个幻影css文件如何以及为何出现的任何想法？如果是这样，我如何防止此文件影响我的样式。这是我的代码的副本，以防有人需要它。

＆＃13;

＆＃13;

/* Default tab style */

.tabs {
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	width: 100%;
	font-weight: 300;
	font-size: 1.25em;
}

/* Nav */
.tabs nav {
	text-align: center;
}

.tabs nav ul {
	position: relative;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	margin: 0 auto;
	padding: 0;
	max-width: 1200px;
	list-style: none;
	-ms-box-orient: horizontal;
	-ms-box-pack: center;
	-webkit-flex-flow: row wrap;
	-moz-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
}

.tabs nav ul li {
	position: relative;
	z-index: 1;
	display: block;
	margin: 0;
	text-align: center;
	-webkit-flex: 1;
	-moz-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.tabs nav a {
	position: relative;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	line-height: 2.5;
	text-decoration: none;
}

.tabs nav a span {
	vertical-align: middle;
	font-size: 0.75em;
}

.tabs nav li.tab-current a {
	color: #74777e;
}

.tabs nav a:focus {
	outline: none !important;
}

/* Icons */
.icon::before {
	z-index: 10;
	display: inline-block;
	margin: 0 0.4em 0 0;
	vertical-align: middle;
	text-transform: none;
	font-weight: normal;
	font-variant: normal;
	font-size: 1.3em;
	font-family: 'stroke7pixeden';
	line-height: 1;
	speak: none;
	-webkit-backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.icon-upload::before {
	content: "\e68a";
}
.icon-tools::before {
	content: "\e60a";
}
.icon-plane::before {
	content: "\e625";
}
.icon-joy::before {
	content: "\e6a4";
}
.icon-plug::before {
	content: "\e69a";
}
.icon-home::before {
	content: "\e648";
}
.icon-gift::before {
	content: "\e652";
}
.icon-display::before {
	content: "\e65e";
}
.icon-date::before {
	content: "\e660";
}
.icon-config::before {
	content: "\e666";
}
.icon-coffee::before {
	content: "\e669";
}
.icon-camera::before {
	content: "\e66f";
}
.icon-box::before {
	content: "\e674";
}

/* Content */
.content-wrap {
	position: relative;
}

.content-wrap section {
	display: none;
	margin: 0 auto;
	padding: 1em;
	max-width: 1200px;
	text-align: center;
}

.content-wrap section.content-current {
	display: block;
}

.content-wrap section p {
	margin: 0;
	padding: 0.75em 0;
	color: rgba(40,44,42,0.05);
	font-weight: 900;
	font-size: 4em;
	line-height: 1;
}

/* Fallback */
.no-js .content-wrap section {
	display: block;
	padding-bottom: 2em;
	border-bottom: 1px solid rgba(255,255,255,0.6);
}

.no-flexbox nav ul {
	display: block;
}

.no-flexbox nav ul li {
	min-width: 15%;
	display: inline-block;
}

@media screen and (max-width: 58em) {
	.tabs nav a.icon span {
		display: none;
	}
	.tabs nav a:before {
		margin-right: 0;
	}
}

/* Individual tab styles */

/*****************************/
/* Top Line */
/*****************************/
#tabs {
	border: 1px solid rgba(40,44,42,0.05);
	border-top: none;
}

.tabs-style-topline {
	max-width: 1200px;
}

.tabs-style-topline nav li {
	border: 1px solid rgba(40,44,42,0.1);
}

.tabs-style-topline nav li:not(:last-child) {
	border-right: none;
}

.tabs-style-topline nav li.ui-state-active {
	border-top: 3px solid #2CC185;
	border-bottom: none;
}
.tabs-style-topline nav li.ui-state-active a {
    background: #fff;
}
.tabs-style-topline nav a {
	padding: 0.75em 0 0.5em !important;
	background: rgba(40,44,42,0.05) !important;
	color: #258e76;
	line-height: 1;
	font-weight: bold !important;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}


.tabs-style-topline nav a:hover {
	color: #2CC185;
}
.tabs-style-topline nav a:focus {
	color: #258e76;
}

.tabs-style-topline nav li.tab-current a {
	background: none;
	box-shadow: inset 0 3px 0 #2CC185;
	color: #2CC185;
}

.tabs-style-topline .icon::before {
	display: block;
	margin: 0;
}

#tabs-1, #tabs-2, #tabs-3, #tabs-4 {
	padding: 10px;
}

＆＃13;

<html lang="en">
<head>
  <meta charset="utf-8">
 <!-- <link rel="stylesheet" href="jquery-ui.css"> -->
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
  <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="tabs.css">
  <link rel="stylesheet" type="text/css" href="tabstyles.css" />

  <script>
  $(function() {
    $( "#tabs" ).tabs();
  });
  </script>
</head>
<body>
 
<div id="tabs" class="tabs tabs-style-topline">
  <nav>
    <ul style="background: transparent; border-top: none; border-left:none; border-right: none;">
      <li><a href="#tabs-1">Tab 1</a></li>
      <li><a href="#tabs-2">Tab 2</a></li>
      <li><a href="#tabs-3">Tab 3</a></li>
      <li><a href="#tabs-4">Tab 4</a></li>
    </ul>
  </nav>
<div id="tabs-1" >
        <p><strong>Tab 1</strong><br>
    <br>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent nec viverra nisi. Donec imperdiet justo arcu, quis ornare magna vehicula vel. Proin fringilla ultricies tellus eget tempus. Mauris vehicula malesuada velit at hendrerit. Pellentesque ac bibendum est, at dictum mi. Curabitur interdum lectus magna, et rhoncus enim vulputate auctor. Nunc eleifend pellentesque libero, et lacinia odio laoreet vitae. Maecenas fermentum sagittis ipsum ut vestibulum. Praesent varius nisi sed nisl ultrices cursus. Aenean risus lacus, ultricies at tincidunt nec, suscipit in diam. Quisque tincidunt sed mauris vitae sodales. Cras hendrerit, metus id sollicitudin ornare, ligula odio porttitor sem, sit amet tristique turpis ipsum in ipsum. Morbi volutpat purus a felis lacinia, ac scelerisque mi vulputate. Phasellus posuere dui sit amet tellus pharetra porta.</p>
  </div>
  <div id="tabs-2">
    <p><strong>Tab 2</strong><br>
    <br>
    In orci massa, imperdiet vel lacinia rutrum, egestas id eros. Integer ac sollicitudin odio. Vestibulum eget gravida tortor. Mauris fringilla dolor at ultricies sodales. Ut hendrerit ligula tempor, venenatis justo sed, luctus felis. Aenean dapibus, orci eu laoreet pretium, lectus diam rhoncus dolor, scelerisque convallis dui neque ut ligula. Duis convallis mauris sed tortor consequat cursus. Aenean dictum placerat mi vel tristique. Vestibulum ornare sem ut arcu posuere pretium. Sed nisi augue, consectetur vel mi vel, sodales hendrerit leo. Sed vulputate tempus est ac vehicula. Vestibulum in pharetra erat.</p>
  </div>
  <div id="tabs-3">
       <p><strong>Tab 3</strong><br>
    <br>In viverra nunc quis magna blandit sodales. Duis tempus molestie pharetra. Maecenas ipsum eros, lacinia vel tincidunt vitae, porttitor nec risus. Mauris faucibus convallis vestibulum. Quisque fringilla non tortor in euismod. Fusce laoreet sapien nec auctor convallis. <br>
    <br>Sed accumsan tortor eu eros pellentesque pulvinar hendrerit vitae nibh. In quis hendrerit eros. Nulla id erat in eros congue maximus. Nam sed lacus vel purus porttitor ultrices. Suspendisse potenti. Fusce sed lorem elementum, accumsan turpis eu, sagittis sapien. Nunc non lorem vitae quam pharetra placerat. Praesent tristique odio non metus lacinia rhoncus.</p>
  </div>
  
  <div id="tabs-4">
        <p><strong>Tab 4</strong><br>
    <br>Integer at blandit leo, sed rhoncus ex. Nulla facilisi. Aliquam fermentum feugiat velit ac feugiat. Praesent a orci ut neque luctus faucibus. Sed pulvinar in tortor eget scelerisque. Sed elementum enim non fringilla placerat. Mauris pulvinar, velit nec ullamcorper varius, turpis leo gravida mi, placerat vehicula urna erat eu metus. Suspendisse lacus neque, tempor et eleifend in, egestas vestibulum enim. Nam commodo mollis tortor non accumsan. Maecenas fringilla ornare mollis.<br>
    <br>
<strong>Nulla at scelerisque nunc.</strong> Aliquam sit amet mi libero. Nulla odio tortor, convallis in mattis vel, porttitor vitae velit. Vestibulum auctor diam nec aliquam iaculis. In nec sapien egestas, tincidunt diam non, gravida lacus. Nullam luctus hendrerit mollis. Duis bibendum, velit sed vulputate hendrerit, sapien eros pharetra metus, nec volutpat arcu felis eu risus. Proin condimentum, odio eu vestibulum fringilla, ex arcu iaculis massa, sagittis dignissim odio tortor non ex. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi porta ullamcorper erat et rhoncus. Cras rutrum nisl vel velit consequat, quis malesuada orci suscipit. Vestibulum in consequat lacus. <br>
<br>Pellentesque sollicitudin aliquet ultrices. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam viverra facilisis felis. Donec lobortis, risus vel venenatis ultrices, magna nulla egestas magna, eu sodales arcu nibh eu lorem.</p>
  </div>
</div>

</body>
</html>

＆＃13;

＆＃13;

＆＃13;