| Kaskádové styly - CSS (Cascading Style Sheet) - CSS v HTML stránce |
|
Linking to an External Style Sheet
|
<LINK REL=StyleSheet HREF="style.css" TYPE="text/css" MEDIA=screen>
<LINK REL=StyleSheet HREF="color-8b.css" TYPE="text/css" TITLE="8-bit Color Style" MEDIA="screen, print">
<LINK REL="Alternate StyleSheet" HREF="color-24b.css" TYPE="text/css" TITLE="24-bit Color Style" MEDIA="screen, print">
<LINK REL=StyleSheet HREF="aural.css" TYPE="text/css" MEDIA=aural> |
<LINK REL=StyleSheet HREF="basics.css" TITLE="Contemporary">
<LINK REL=StyleSheet HREF="tables.css" TITLE="Contemporary">
<LINK REL=StyleSheet HREF="forms.css" TITLE="Contemporary"> |
Embedding a Style Sheet
|
<STYLE TYPE="text/css" MEDIA=screen>
<!--
BODY { background: url(foo.gif) red; color: black }
P EM { background: yellow; color: black }
.note { margin-left: 5em; margin-right: 5em }
-->
</STYLE> |
Importing a Style Sheet
|
<STYLE TYPE="text/css" MEDIA="screen, projection">
<!--
@import url(http://www.htmlhelp.com/style.css);
@import url(/stylesheets/punk.css);
DT { background: yellow; color: black }
-->
</STYLE> |
Inlining Style
|
| <P STYLE="color: red; font-family: 'New Century Schoolbook', serif"> This paragraph is styled in red with the New Century Schoolbook font, if available.</P> |
The CLASS Attribute
|
.punk { color: lime; background: #ff80c0 }
P.warning { font-weight: bolder; color: red; background: white }
These classes could be referenced in HTML with the CLASS attribute:
<H1 CLASS=punk>Proprietary Extensions</H1>
<P CLASS=warning>Many proprietary extensions can have negative side-effects, both on supporting and non-supporting browsers... |
The ID Attribute
|
#wdg97 { font-size: larger }
may be applied in HTML through the ID attribute:
<P ID=wdg97>Welcome to the Web Design Group!</P> |
The SPAN Element
|
Příklad:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Draft//EN">
<HTML>
<HEAD>
<TITLE>Example of SPAN</TITLE>
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">
<STYLE TYPE="text/css" MEDIA="screen, print, projection">
<!--
.firstwords { font-variant: small-caps }
-->
</STYLE>
</HEAD>
<BODY>
<P><SPAN CLASS=firstwords>The first few words</SPAN> of a
paragraph could be in small-caps. Style may also be inlined, such as
to change the style of a word like <SPAN STYLE="font-family: Arial">
Arial</SPAN>.</P> |
The DIV Element
|
Příklad:
<DIV CLASS=note>
<H1>Divisions</H1>
<P>The DIV element is defined in HTML 3.2, but only the ALIGN attribute is permitted in HTML 3.2. HTML 4.0 adds the CLASS, STYLE, and ID attributes, among others.</P>
<P>Since DIV may contain other block-level containers, it is useful for marking large sections of a document, such as this note.</P>
<P>The closing tag is required.</P>
</DIV> |
|
|
| Kaskádové styly - CSS (Cascading Style Sheet) - CSS v HTML stránce |
|
|