XML/CSS Style — различия между версиями
Admin (обсуждение | вклад) м (1 версия) |
|
(нет различий)
| |
Текущая версия на 08:26, 26 мая 2010
- Attribute
- Border
- Padding
- Word spacing
- align
- background
- break
- clear
- clip
- color
- column
- content
- display
- float
- foreground
- height
- inline block
- letter spacing
- line height
- list
- margin
- overflow
- paragraph
- position
- pseudo class
- table
- text decoration
- text transform
- width
- xlink
- xml stylesheet
- z index
Содержание
bold font
File: Data.xml
<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="Style.css"?>
<document xmlns:html="http://www.w3.org/TR/REC-html40">
<page>
<title>Links</title>
<paragraph>The
<html:a href="http://www.wbex.ru" target="_blank">link</html:a>
will open in a new window.
</paragraph>
</page>
</document>
File: Style.css
title{
display:block;
color: #000000;
font-size: 30px;
font-weight: bold;
}
paragraph {
display:block;
padding:10px;
margin: 10px;
}
Choosing a Font Family
File: Data.xml
<?xml version="1.0" ?>
<?xml-stylesheet type="text/css" href="Style.css" ?>
<employees>
<name language="English">T1</name>
<name language="Latin">T2</name>
<projects>
<project>project1</project>
<project>project2</project>
<project>
project3
</project>
</projects>
<weight>3 points</weight>
<length>3 years</length>
</employees>
File: Style.css
name {
font-family:Trebuchet MS, Arial, sans-serif
}
weight, project{
font-family:Georgia, Times, serif
}
Font size and weight
File: Data.xml
<?xml version="1.0" encoding="UTF-8" ?>
<?xml-stylesheet type="text/css" href="Style.css" ?>
<page>
<pageNumber>1</pageNumber>
<paragraph>
A
<reference>B</reference>
<footnoteNumber>C</footnoteNumber>
D
<keywords>E</keywords>
F
</paragraph>
</page>
File: Style.css
footnoteNumber {
position:relative; top:3px;
display:inline;
font-size:9pt;
font-weight:bold;
color:#990000;
border-style:solid;
border-width:2px;
border-color:#CCCCCC;
}
page {
display:block;
padding:10px;
margin:10px;
border-style:solid;
border-width:4px;
border-color:#000000;
}
pageNumber {
display:inline;
font-style:italic;
border-style:solid;
border-width:4px;
border-color:#CCCCCC;
}
paragraph {
display:block;
padding:10px;
border:solid;
border-width:4px;
border-color:#CCCCCC;
}
reference {
display:inline;
font-style:italic;
color:#CC3333;
border:solid;
border-width:2px;
border-color:#CCCCCC;
}
keyword {
display:inline;
font-weight:bold;
color:#990000;
border:solid;
border-width:2px;
border-color:#CCCCCC;
}
font style: italic and bold
File: Style.css
BOOK {
display:block;
margin-top:12pt;
font-size:10pt
}
TITLE {
font-style:italic
}
AUTHOR {
font-weight:bold
}
File: Data.xml
<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="Style.css"?>
<INVENTORY>
<BOOK>
<TITLE>title 1</TITLE>
<AUTHOR>author 1</AUTHOR>
<BINDING>paperback</BINDING>
<PAGES>1</PAGES>
<PRICE>$1.1</PRICE>
</BOOK>
</INVENTORY>
footnote style
File: Data.xml
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="Style.css"?>
<page>
<pageNumber>1</pageNumber>
<paragraph>
A
<reference>B<footnote>C</footnote></reference>
D
<important>E</important>.
</paragraph>
</page>
File: Style.css
paragraph {
display:block;
border:solid 1px #A3A3A3;
padding: 10px;
margin: 20px;
}
reference {
display:inline;
font-style:italic;
color:#CC3333;
background-color: #E6E6E6;
}
important {
display:inline;
font-weight:bold;
color:#990000;
border:solid 1px #990000;
}
page {
display:block;
border:solid 2px #000000;
padding: 10px;
margin:10px;
}
pageNumber {
display:block;
padding:5px;
border:solid 2px #336699;
width: 60px;
margin-bottom: 20px;
}
Page number style
File: Data.xml
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="Style.css"?>
<page>
<pageNumber>1</pageNumber>
<paragraph>
A
<reference>B<footnote>C</footnote></reference>
D
<important>E</important>.
</paragraph>
</page>
File: Style.css
paragraph {
display:block;
border:solid 1px #A3A3A3;
padding: 10px;
margin: 20px;
}
reference {
display:inline;
font-style:italic;
color:#CC3333;
background-color: #E6E6E6;
}
important {
position:relative;
background-color:#FFFFFF;
right:75px;
display:inline;
font-weight:bold;
color:#990000;
border:solid 1px #990000;
}
page {
display:block;
border:solid 2px #000000;
padding: 10px;
margin:10px;
}
pageNumber {
display:block;
padding:5px;
border:solid 2px #336699;
width: 60px;
margin-bottom: 20px;
}
Setting All Font Values at Once
File: Data.xml
<?xml version="1.0" ?>
<?xml-stylesheet type="text/css" href="Style.css" ?>
<employees>
<name language="English">T1</name>
<name language="Latin">T2</name>
<projects>
<project>project1</project>
<project>project2</project>
<project>project3</project>
</projects>
<weight>3 points</weight>
<length>3 years</length>
</employees>
File: Style.css
name {
font: bold 24pt/22pt Trebuchet MS;
width:100;
margin-top:10
}
project {
font: 10pt Georgia
}
weight {
font-style:italic
}
length{
font-weight:bold
}
Setting the Font Size
File: Data.xml
<?xml version="1.0" ?>
<?xml-stylesheet type="text/css" href="Style.css" ?>
<employees>
<name language="English">T1</name>
<name language="Latin">T2</name>
<projects>
<project>project1</project>
<project>project2</project>
<project>project3</project>
</projects>
<weight>3 points</weight>
<length>3 years</length>
</employees>
File: Style.css
name {
font-family:Trebuchet MS;
font-weight:bold;
font-size:24pt;
width:100;
margin-top:10
}
project{
font-family:Georgia;
font-size:10pt
}
weight {
font-style:italic
}
length{
font-weight:bold
}
smaller font size
File: Data.xml
<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="Style.css"?>
<POEM>
<TITLE>title</TITLE>
<AUTHOR>author 1</AUTHOR>
<DATE>2008</DATE>
<PARAGRAPH>
<LINE>line 1</LINE>
<LINE>line 2</LINE>
<LINE>line 3</LINE>
<LINE>line 4</LINE>
<LINE>line 5</LINE>
<LINE>line 6</LINE>
</PARAGRAPH>
<PARAGRAPH>
<LINE>line 7</LINE>
<LINE>line 8</LINE>
<LINE>line 9</LINE>
<LINE>line 10</LINE>
<LINE>line 11</LINE>
<LINE>line 12</LINE>
</PARAGRAPH>
</POEM>
File: Style.css
POEM {
font-size:small
}
POEM, TITLE, AUTHOR, DATE, PARAGRAPH, LINE {
display:block
}