Search DominoPower's 10,675 Lotus-related article archive 
Home
EasyPrint
News details Click here for the RSS feed's XML code. This is not a browser URL.
Articles-only Click here for the RSS feed's XML code. This is not a browser URL.
Twitter Feed Click here for the Twitter feed.
PROGRAMMING POWER
Keep lookin' good with Cascading Style Sheets
By Andrew Stuart

In my previous article, "Cascading Style Sheets make you look good," at http://www.dominopower.com/issues/issue200204/cascade001.html, we made a start on getting to know CSS (Cascading Style Sheets). This time, we'll continue this discussion by taking a look at both "embedded" Cascading Style Sheets and "linked" Cascading Style Sheets.

Previously, by using the STYLE attribute we were able to control the appearance of individual HTML page elements without using any Javascript or other code. Using the STYLE attribute means that you're including the specific style properties and values into the actual HTML tags themselves. This is called "inline" cascading style sheets.

Inline CSS is useful and quick, and it's great for fine-tuning the appearance of specific individual page elements. On the downside, it can be repetitive and difficult to maintain, and all those CSS properties can make your HTML code messy and difficult to understand at a glance. The other problem with inline CSS is that making changes often means going through all your code and finding all the places that you've used the STYLE attribute and editing them individually. Inline CSS doesn't facilitate global changes.

Embedded CSS is more flexible than inline CSS. Embedded CSS allows you to define a set of CSS "rules" which can be used throughout the HTML page. The CSS rules are gathered together into a single place--in between a pair of <STYLE> tags located inside the <HEAD> block at the start of the page.

Here's an example of an embedded style sheet:

<head>
<style>
.myrule {
font: 23px Verdana, Geneva, Arial, Helvetica, sans-serif;
color : green;
font-weight:bold }
#anotherrule {
font: 10pt Arial, Helvetica, sans-serif;
color : black;
font-weight:italic }

</style>
</head>

<p class='myrule'>the first test</p>
<p id='anotherrule'>another test</p>

Rule structure
In order to understand Cascading Style Sheets, you need to understand CSS rules and the structure of those rules. The above example contains two rules, contained within the <STYLE> tags. Each rule starts with a "selector". The selectors in this example are named "myrule" and "anotherrule".

After the selector comes as many specific style declarations and values as you choose, separated by semicolons. A final curly bracket completes the rule.


1  ·  2  ·  3  ·  Next »
Other articles you might like
Home > Internet Technologies > HTML and CSS (15 articles)
   Using a reusable code approach to HTML select option lists
   One reader's opinion on HTML mailing
   Cascading Style Sheets make you look good
Get Weekly Email Updates
Subscribe to our regular weekly email newsletter. It's packed with tips, reviews, deep analysis, and the latest news.
 
Recent DominoPower Articles
What to look for in a Domino-based document management solution
Understanding Domino.doc end-of-life options
When the debugger won't debug hidden code that isn't hidden
What to do if the LotusScript debugger won't single-step over code
Top 10 ways to launch and build a Lotus consulting practice (with a little help from the Beatles)
Troubleshooting an OpenSuse Notes install
Incident report: denial of service attack against ConnectedPhotographer.com
Latest Lotus Headlines
SnTT - Enabling ALL the bells and whistles!
Tivoli Data protection causes Domino to crash
Fun when running DB2 CLP scripts
Introducing Flippr, the easy way to admin Quickr
DXL and fake security
Using search forms in IBM Workplace Collaborative Learning 2.7
Schmidt, Freed, and Gering on the OVF Toolkit
>> Read all the news
More from the ZATZ journals
Computing Unplugged: Eight steps to successful and reliable home backups
David Gewirtz Online: CNN commentary and analysis
OutlookPower: Can Outlook run when it's not running (and other mysteries)?
-- Advertisement --

Learn Notes and Domino 8 at your place and pace!
Learn Notes and Domino in your office and/or home! TLCC's highly acclaimed distance learning courses for users, developers, and admins will enhance your career and your resume.

The many included activities and demos will make you a pro! Expert instructor help is a click away.

Click here to try a FREE demo course!!

-- Advertisement --

Want The Top Lotus Experts By Your Side Without Paying Hefty Consulting Fees? Look No Further.
Like having a team of consultants by your side -- ones who have all the answers and never make mistakes -- THE VIEW gives you immediate access to field-tested instruction, guidance, and best practices from the brightest Lotus professionals around.

Join your peers who realize their Lotus technology is too important to let people from blogs and forums tell them how they should implement it, run it, and use it. THE VIEW is where only the world's top Lotus experts provide validated support to you on a weekly basis to ensure you work more efficiently, get more out of your Lotus technology, and stay clear of costly mistakes.

Check out the new instruction, tips, and best practices added to THE VIEW this week.

ZATZ Home  ·  News  ·  Back Issues  ·  Credits/Trademarks ·  Link To Us
Copyright © 1998-2009, ZATZ Publishing. All rights reserved worldwide.
Editor's Login