XML/CSS Style/background — различия между версиями
Admin (обсуждение | вклад) м (1 версия) |
|
(нет различий)
|
Текущая версия на 11:26, 26 мая 2010
Содержание
Background repreat and position
<source lang="xml">
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> <IMAGE /> <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> <IMAGE /> <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:12pt
} POEM, TITLE, AUTHOR, DATE, IMAGE, PARAGRAPH, LINE{
display:block
} DATE, PARAGRAPH{
margin-bottom:.25in
} IMAGE {
background-image:url(Raven.bmp); background-repeat:no-repeat; background-position:center; width:89px; height:58px; float:left
}
</source>
Changing the Background
<source lang="xml">
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
employees {
display:block; color:black; background:url(back.jpg)
} name {
display:block; position:absolute; left:9px
} projects{
display:block; border:medium dotted red; padding:5px; margin-top:10px
} project{
display:block; position:relative; left:125px; width:340px; border:thin solid red; padding:5px; margin-top:5px
} weight{
float:right; width:125px; border:thin solid green; padding:5px; color:black
} length{
display:block
}
</source>
Changing the Text"s Background
<source lang="xml">
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 employees {
background:#ffe7c6
} name {
font: bold 24pt/22pt Trebuchet MS; width:100; margin-top:10; color:#a50063
} projects{
font:10pt Georgia; background:#ffffcc
} project{
background:#ffc6a5
} weight {
font-style:italic
} length{
font-weight:bold
}
</source>
Use image as background
<source lang="xml">
File: Data.xml <?xml version="1.0"?> <?xml-stylesheet type="text/css" href="Style.css"?> <document>
<page> <image1 /> <title>this is the title</title> <paragraph>this is a paragraph</paragraph> </page>
</document> File: Style.css title{
display:block; color: #000000; font-size: 30px; font-weight: bold;
} paragraph {
display:block; padding:10px; margin: 10px;
} image1 {
display:block; margin:10px; width:282px; height:187px; background-image:url(background.jpg)
}
</source>