جعل نظرة XML الخاص بك كيف تريد ذلك إلى مع أوراق الأنماط المتتالية
إن إنشاء مستند XML وكتابة DTD وتعديله باستخدام متصفح جيد تمامًا ، ولكن كيف سيتم عرض المستند عند عرضه؟ XML ليست لغة العرض. في الواقع ، لن تحتوي المستندات المكتوبة بـ XML على أي تنسيق على الإطلاق.
لذا ، كيف يمكنني عرض ملف XML الخاص بي؟
المفتاح لعرض XML في المستعرض هو Cascading Style Sheets. تسمح لك أوراق الأنماط بتحديد كل جانب من جوانب مستند XML ، من حجم النص الخاص بك ولونه إلى الخلفية والموضع الخاصين بكائنات غير نصية.
لنفترض أن لديك مستند XML:
<؟ xml version = "1.0" standalone = "yes"> ]>إذا كنت تريد عرض هذا المستند في متصفح جاهز لـ XML ، مثل Internet Explorer ، فسيعرض شيئًا مثل هذا:
جودي لايار جنيفر بريندانولكن ماذا لو كنت تريد التفريق بين العناصر الأم والطفل؟ أو حتى إجراء تمييز مرئي بين جميع العناصر في المستند. لا يمكنك فعل ذلك باستخدام XML ، وليست لغة مخصصة للعرض.
ولكن لحسن الحظ ، من السهل استخدام Cascading Style Sheets ، أو CSS ، في مستندات XML لتحديد كيف تريد عرض تلك المستندات والتطبيقات عند عرضها في مستعرض. بالنسبة إلى المستند أعلاه ، يمكنك تحديد نمط كل من العلامات بنفس الطريقة التي تستخدم بها مستند HTML.
على سبيل المثال ، في HTML قد ترغب في تعريف كل النص داخل علامات الفقرة (
) مع وجه الخط Verdana أو Geneva أو Helvetica واللون الأخضر. لتعريف ذلك في ورقة أنماط بحيث تكون جميع الفقرات كما يلي ، يمكنك كتابة:
p {font-family: verdana، geneva، helvetica؛ لون الخلفية: # 00ff00 ؛ }تعمل نفس القواعد لمستندات XML. يمكن تعريف كل علامة في XML في وثيقة XML:
family {color: # 000000؛ } parent {font-family: Arial Black؛ اللون: # ff0000؛ border: solid 5px؛ العرض: 300 بكسل ؛ } الطفل {font-family: verdana، helvetica؛ اللون: # cc0000؛ border: solid 5px؛ border-color: # cc0000؛ }بمجرد كتابة مستند XML الخاص بك وطباعة ورقة أنماطك ، ستحتاج إلى تجميعهما معاً. على غرار الأمر link في HTML ، يمكنك وضع خط أعلى مستند XML (أسفل تعريف XML) ، وإخبار محلل XML بمكان العثور على ورقة الأنماط. فمثلا:
<؟ xml-stylesheet type = "text / css" href = "stylesheet.css"؟>كما قلت أعلاه ، يجب العثور على هذا السطر أسفل تعريف <؟ xml؟> ولكن قبل أي من العناصر في مستند XML.
وضع كل ذلك معا ، سوف يقرأ مستند XML الخاص بك:
<؟ xml version = "1.0" standalone = "yes"> <؟ xml-stylesheet type = "text / css" href = "stylesheet.css"؟> < ! ELEMENT child (#PCDATA)>]>