آموزش 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 را ببینید :

خروجی XML مشاهده خروجی سند


راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی


نطر خودتان درباره این صفحه را با ما در میان بگذارید :

آیا مطالب این صفحه برای شما مناسب و مفید بوده است :

نام :                 
آدرس Email :    
 
نظر شما :