Amr*_*ngh 2 html javascript css php jquery
我必须只包含一个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个html,在另一个条件下显示另一个chunk.要执行此操作,请将代码更改为:
<?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 Components,http://webcomponents.org/和shadow DOM,http://webcomponents.org/articles/introduction-to-shadow-dom/,但我认为在你的情况下最好是只需给每个divid或类,并从一个css样式表专门应用css到该id或类.
UPDATE
要将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
}