【发布时间】:2014-01-11 01:20:20
【问题描述】:
我正在制作一个只有两个主要页面的网站,即“索引”和“关于我”页面。在制作完模板和所有内容后,我遇到了一个令人困惑的问题,我无法真正编辑 about 页面的 Css 样式。
基本上,我的 About 和 Index 页面从我的主 Html(从头开始制作的模板)获得了相同的模板,我觉得那里很好 .. 但我希望我的 About 页面与我的 Index 页面有不同的外观,每次我对想要从“关于”页面中消失的可编辑区域进行了更改,它也会影响索引页面。样式表也是如此,我希望关于页面上有不同的颜色,但似乎每次我做某事都会影响整个网站。
这是我到目前为止制作的网站的图片。 Homepage and about page
两个页面都有相同的模板、相同的可编辑区域和相同的 css,目前看起来完全一样,但我想从 about 页面中删除 div class:"notes" 并扩大他的 div id="main-content" 更改的宽度几乎每一种颜色,我的意思是关于页面的整个样式,而不影响主页并保持原样..我该怎么办?请
谢谢
PS:我正在使用 Dreamweaver cs6。
main dwt html/about 和 index 页面的相同 html 唯一的区别是 for index 和 about 不可编辑
<code>
<!doctype html>
<html>
<head>
<!--JavaScript that enables Internet Explorer (version 8 and below) to recognise HTML5 elements -->
<script type="text/javascript">
document.createElement ('article')
document.createElement ('nav')
document.createElement ('aside')
document.createElement ('header')
document.createElement ('footer')
document.createElement ('main')
</script>
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/timothy.js"></script>
<link href="../css/stylesheet.css" rel="stylesheet" type="text/css" media="screen">
<meta charset="utf-8">
<!-- TemplateBeginEditable name="doctitle" -->
<title>My Uni Website</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
</head>
<body>
<!--Write web page content and markup within the 'body' tags -->
<div id="outer">
<div class="frame">
<div class="fade"></div>
<img src="../images/huxley.jpg"/>
</div>
<div id="wrapper">
<!--The 'wrapper' div contains all the page content and can be styled -->
<div id="icon">
<ul>
<li><a href="http://www.twitter.com/justcallmebigdi"><img src="../images/twitter.png" width="20" /></a></li>
<li><a href="http://www.behance.net/justcallmebigdi"><img src="../images/behance.png" width="20" /></a></li>
</ul>
</div>
<div id="logo"><a href><img src="../images/logo2.png" width="209" height="207"/></a></div>
<!--The main heading for the page -->
<header>
<!-- <h1>CI135 Learning journal</h1> -->
<h2> How I mastered web standards in 10 weeks</h2>
</header>
<!--The primary navigation for the page -->
<nav>
<ul>
<li><a href="../index.html">HOME</a></li>
<li><a href="../about.html">ABOUT ME</a></li>
</ul>
</nav>
<!--Secondary sidebar navigation -->
<aside>
<div class="image"><img src="../images/information.png" width="100"/></div>
<div class="aside">
<!-- TemplateBeginEditable name="aside" -->
<h3> The Weekly posts </h3>
<ol>
<li><a href="../index.html">Getting started</a></li>
<li><a href="../index.html">Learning more about tags</a></li>
<li><a href="../index.html">Learning about lists and tables</a></li>
</ol>
<h3> Favourites</h3>
<ul>
<li> <a href="../index.html"> W3C markup validation service </a></li>
<li> <a href="../index.html"> Web platform Docs - Web development for beginners </a> </li>
<li> <a href="../index.html"> Html5 Doctor - Helping you implement HTML5 today </a></li>
</ul>
<h3> Basic Definitions </h3>
<dl>
<dt><strong>HTML</strong></dt>
<dd>Hyper-text markup language - markup language used to structure content</dd>
<dt><strong>CSS</strong></dt>
<dd>Cascading stylesheets - used to tell browsers how to present HTML elements</dd>
<dt><strong>JavaScript</strong></dt>
<dd>Scripting language for adding interactive behaviour to web pages</dd>
</dl>
<!-- TemplateEndEditable -->
<h3> My time table </h3>
<table width="523" height="81" border="1">
<tr>
<td width="71" height="23" bgcolor="#FFFFFF">Day/Time</td>
<td width="215" bgcolor="#FFFFFF">Monday</td>
<td width="215" bgcolor="#FFFFFF">Tuesday</td>
</tr>
<tr>
<td height="25" bgcolor="#FFFFFF">9-10 am</td>
<td> </td>
<td>Lecture</td>
</tr>
<tr>
<td height="23" bgcolor="#FFFFFF">10-11 am</td>
<td>lecture</td>
<td>Lab</td>
</tr>
</table>
</div>
</aside>
<!--The main page content -->
<main><!-- TemplateBeginEditable name="mainContent" -->
<article>
<!--Content node -->
<div class="header">
<h1>Week 3: Tables, link images, quoting text </h1>
</div>
<p>In the first 3 lab tutorials I learned some of the most frequently used HTML tags and how to use them to structure text in a web page. <br>
PS: ADD MORE COMMENTS ABOUT WEEK 3. </p>
</article>
<article>
<div class="header">
<h1>Week 2</h1>
</div>
<p>PS: ADD COMMENTS ABOUT WEEK 2.</p>
</article>
<article>
<div class="header">
<h1>Week 1</h1>
</div>
<p>ADD COMMENTS ABOUT WEEK 1. </p>
<p>In the first 3 lab tutorials I learned some of the most frequently used HTML tags and how to use them to structure text in a web page. <br>
PS: ADD MORE COMMENTS ABOUT WEEK 3In the first 3 lab tutorials I learned some of the most frequently used HTML tags and how to use them to structure text in a web page. <br>
PS: ADD MORE COMMENTS ABOUT WEEK 3In the first 3 lab tutorials I learned some of the most frequently used HTML tags and how to use them to structure text in a web page. <br>
PS: ADD MORE COMMENTS ABOUT WEEK 3In the first 3 lab tutorials I learned some of the most frequently used HTML tags and how to use them to structure text in a web page. <br>
PS: ADD MORE COMMENTS ABOUT WEEK 3In the first 3 lab tutorials I learned some of the most frequently used HTML tags and how to use them to structure text in a web page. <br>
PS: ADD MORE COMMENTS ABOUT WEEK 3</p>
</article>
<!-- TemplateEndEditable --></main>
<div id="right_side_note">
<div class="post"><!-- TemplateBeginEditable name="SideNotes" -->
<h2>Notes</h2>
<p class="date">March 22, 2011</p>
<p>The W3C defines HTML and CSS as follows:</p>
<blockquote>
<p>HTML (the Hypertext Markup Language) and CSS (Cascading Style Sheets) are two of the core technologies for building Web pages. HTML provides the structure of the page, CSS the (visual and aural) layout, for a variety of devices. Along with graphics and scripting, HTML and CSS are the basis of building Web pages. <br>
<cite>W3C standards for web </cite></p>
</blockquote>
<!-- TemplateEndEditable --></div>
</div>
<div id="footer">
<!--Footer content -->
<p class="footer-text">© 2013 Daniel Biakath / University of Brighton.</p>
</div>
</div>
</div>
<!--Close 'wrapper' div -->
</body>
<!--Close 'body' -->
</html>
<code>
【问题讨论】:
-
你应该做 2 个不同的 css 页面,并在正确的页面中调用它们。
-
是的,伙计,我想过..但是然后如何将新的css页面链接到about页面..
-
他只是解释说,当他说“在正确的页面中呼叫他们”时。如果您需要如何链接到 CSS 文件的示例,您应该在下面看到答案。
-
您应该包含每个页面的 HTML,而不是图片。
标签: html css templates web dreamweaver