آموزش XML > مشاهده و قالب بندی فایل های XML > قالب بندی
فایل های XML با CSS
قالب بندی فایل های XML با CSS :
همانطور که در بخش های قبل توضیح دادیم ، فایل های XML برای نگهداری و انتقال اطلاعات
استفاده شده و خود دارای ویژگی ها یا امکاناتی برای نمایش اطلاعات نیستند .
مرورگرها نیز فایل های XML را به صورت متن ساده و بدون قالب بندی خاص نمایش می دهند
.
اما ممکن است شما تمایل داشته باشید تا فایل های XML خود را با ظاهر و قالب بندی
خاص نمایش دهید . در این حالت می توانید از یک فایل CSS ، همانگونه که در HTML استفاده
می کردیم ، استفاده نمایید .
در این بخش قصد داریم تا نحوه این کار را به شما آموزش دهیم .
اتصال یک فایل CSS به سند XML :
برای قالب بندی فایل XML توسط CSS ، ابتدا باید فایل XML را به فایل CSS متصل نمایید
. برای این منظور از یگ تگ < ?xml > شامل آدرس فایل CSS مورد نظر ، در ابتدای
سند XML استفاده می شود :
کد فایل
XML
به همراه لینک به
CSS فایل
|
<?xml version="1.0" encoding="ISO-XMLXML59-1" ?>
<?xml-stylesheet type="text/css" href="book_catalog.css" ?>
<CATALOG>
<BOOK>
<TITLE> HTML</TITLE>
<AUTHER> Developer1 </AUTHER>
<COMPANY> Pishgaman </COMPANY>
<PRICE> 4500 </PRICE>
<YEAR> 13XML9</YEAR>
</BOOK>
<BOOK>
<TITLE> CSS </TITLE>
<AUTHER> Amiri </AUTHER>
<COMPANY> Tebian </COMPANY>
<PRICE> 6500 </PRICE>
<YEAR> 1390</YEAR>
</BOOK>
</CATALOG>
|
کد فایل CSS مورد استفاده :
در جدول زیر کدی فایل CSS ای که برای قالب بندی سند XML خود به کار برده ایم را نمایش
داده ایم . به آن دقت نمایید :
کد فایل
XML
به همراه لینک به
CSS فایل
|
CATALOG
{
background-color: #ffffff;
width: 100%;
}
BOOK
{
display: block;
margin-bottom: 30pt;
margin-left: 0;
}
TITLE
{
color: #FF0000;
font-size: 20pt;
}
AUTHER
{
color: #0000FF;
font-size: 20pt;
}
PRICE,YEAR,COMPANY
{
display: block;
color: #000000;
margin-left: 20pt;
}
|
نتیجه اتصال فایل CSS به سند XML :
پس از اینکه فایل CSS را به سند XML متصل کردید ، فایل CSS آن را قالب بندی کرده و
با استایل جدید نمایش می دهد . مرورگر فایل XML را به جای نمایش ساده ، با قالب CSS
نشان می دهد . با کلیک بر روی لینک زیر ، اثر فایل CSS بر روی سند XML را ببینید :
راجع این مطلب
سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...
>>>>> ورود به انجمن تخصصی
نطر خودتان درباره این صفحه را با ما در میان بگذارید :