我必须仅包含一个 div 的 css 文件,并包含第二个 div 的另一个 css 文件。我们应该怎么做? 我已经尝试过切换案例,但是当它为一种情况加载 css 时,它仍然在其他情况下显示 css 效果。
这是我迄今为止尝试过的:
<?php
switch ($type_show1):
case 'welcome1':
//default:
?>
<link href="css/main.css" rel="stylesheet" type="text/css" /> // css to include
<div class="page-header">
<div class="page-title">
<h5>Booking Management</h5>
<span>Good morning, Admin!</span>
</div>
</div>
<!-- /page header -->
<?php
break;
endswitch;
?>
<?php
switch ($type_show2):
case 'welcome2':
//default:
?>
<!--<link href="css/main.css" rel="stylesheet" type="text/css" />--> // css not to include
<div class="page-header">
<div class="page-title">
<h5>Booking Management</h5>
<span>Good morning, Admin!</span>
</div>
</div>
<?php
break;
endswitch;
?>
任何帮助:)
最佳答案
每当您将 css 文件添加到页面时,它都会应用于整个文档。然而,看看你的代码,我认为你想要做的是在一种条件下显示 1 block html,在单独的条件下显示另一 block 。为此,请将代码更改为:
<?php
switch ($type_show1):
case 'welcome1':
//default:
?>
<link href="css/main.css" rel="stylesheet" type="text/css" />
<?php
break;
case 'welcome2' :
?>
<link href="css/main2.css" rel="stylesheet" type="text/css"/>
<?php
break;
?>
<div class="page-header">
<div class="page-title">
<h5>Booking Management</h5>
<span>Good morning, Admin!</span>
</div>
</div>
<!-- /page header -->
谈论您实际上所说的每个元素使用一个样式表。 可以使用 Web 组件,http://webcomponents.org/和影子 DOM,http://webcomponents.org/articles/introduction-to-shadow-dom/ ,但我认为在您的情况下,最好简单地为每个 div
提供一个 id 或一个类,然后将 css 专门应用于一个 css 样式表中的该 id 或类。
更新
要将 CSS 应用到两个不同的 div,请执行以下操作:
HTML
<html>
<head>
<link href="css/main.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="page-header" id="div1">
<div class="page-title">
<h5>Booking Management</h5>
<span>Good morning, Admin!</span>
</div>
</div>
<div class="page-header" id="div2">
<div class="page-title">
<h5>Booking Management</h5>
<span>Good morning, Admin!</span>
</div>
</div>
</body>
</html>
CSS(main.css)
#div1 {
//Some CSS Styles to apply to the first div
}
#div2 {
//Some CSS Styles to apply to the second div
}
关于javascript - 如何仅包含一个div的样式表文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28651584/