Jump to content
New Reality: Ads For Members ×

Is it possible to have an external css document and inpage css fomatting?


paddyhaig

Recommended Posts

Would this be the correct way of doing it in my example below? Or is the a more acceptable standardized way? Thanks in advance for your help.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>example/title>

<!-- This is an experiment using an inpage style -->
<style type="text/css">

#box_a {
height: 184px;
width: 145px;
padding: 0px;
left: 160px;
top: 120px;
position: absolute;
margin-top: -55px;
margin-right: auto;
margin-bottom: auto;
margin-left: -65px;
}	
</style>

<!-- This is an experiment using also an external style sheet -->
<link href="css/text_test.css" rel="stylesheet" type="text/css" />

</head>
<body>
</body>
</html>

You have 3 forms to include CSS:

 

External:

<link href="stylesheet.css">

 

Internal:

<style type="text/css">

..

</style

 

And inline:

<p style="color: blue">..</p>

 

inline overwrites internal, internal overwrites external.

Thank you for your answer. What I want is for all the pages to share a single style css sheet for their backdrop and text, so that the backdrop and text through-out the site is consistent. But the table placement in the pages is unique, so I want the div's and css rules for the table placement to internal. I don't want a huge and difficult to understand external css sheet. Is the below valid? I guess unlike the first example I should put the link to the external style sheet first (Before the internal style sheet's styles)? Is this the correct way to do this???

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>example/title>

<!-- This is an experiment using an external style sheet -->
<link href="css/text_test.css" rel="stylesheet" type="text/css" />

<!-- This is an experiment using also an internal style -->
<style type="text/css">

#center_box {
height: 184px;
width: 145px;
padding: 0px;
left: 160px;
top: 120px;
position: absolute;
margin-top: -55px;
margin-right: auto;
margin-bottom: auto;
margin-left: -65px;
}
</style>
<!-- I would like for the styles to be pulled from both the style rule containers -->

</head>

<body>
<div id="wrapper">
<div id="small-blue-box">
<div id="center_box">

</body>
</html>

 

 

Archived

This topic is now archived and is closed to further replies.



×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.