diff --git a/html/arabic/net/generate-jpg-and-png-images/_index.md b/html/arabic/net/generate-jpg-and-png-images/_index.md index 432f80cdc..f94b47674 100644 --- a/html/arabic/net/generate-jpg-and-png-images/_index.md +++ b/html/arabic/net/generate-jpg-and-png-images/_index.md @@ -45,6 +45,8 @@ Aspose.HTML for .NET هي مكتبة قوية تتيح للمطورين إنشا تعلم كيفية تمكين مضاد التعرج عند تحويل ملفات DOCX إلى صور PNG أو JPG باستخدام Aspose.HTML. ### [تحويل docx إلى png – إنشاء أرشيف zip في C# – دليل تعليمي](./convert-docx-to-png-create-zip-archive-c-tutorial/) تعلم كيفية تحويل ملفات docx إلى صور PNG وإنشاء أرشيف ZIP باستخدام C# و Aspose.HTML. +### [إنشاء PNG من HTML في C# – دليل خطوة بخطوة](./create-png-from-html-in-c-step-by-step-guide/) +تعلم كيفية تحويل HTML إلى صورة PNG باستخدام C# و Aspose.HTML خطوة بخطوة. ## خاتمة diff --git a/html/arabic/net/generate-jpg-and-png-images/create-png-from-html-in-c-step-by-step-guide/_index.md b/html/arabic/net/generate-jpg-and-png-images/create-png-from-html-in-c-step-by-step-guide/_index.md new file mode 100644 index 000000000..423f860cf --- /dev/null +++ b/html/arabic/net/generate-jpg-and-png-images/create-png-from-html-in-c-step-by-step-guide/_index.md @@ -0,0 +1,194 @@ +--- +category: general +date: 2026-02-11 +description: إنشاء PNG من HTML باستخدام Aspose.HTML في C#. تعلم كيفية تحويل HTML إلى + PNG، وتحويل HTML إلى صورة، وحفظ HTML كملف PNG مع تحسين النص. +draft: false +keywords: +- create png from html +- render html to png +- convert html to image +- render html as png +- save html as png +language: ar +og_description: إنشاء PNG من HTML بسرعة. يوضح هذا الدرس كيفية تحويل HTML إلى PNG، + وتحويل HTML إلى صورة، وحفظ HTML كملف PNG مع الكود الكامل. +og_title: إنشاء PNG من HTML في C# – دليل كامل +tags: +- Aspose.HTML +- C# +- Image Rendering +title: إنشاء PNG من HTML في C# – دليل خطوة بخطوة +url: /ar/net/generate-jpg-and-png-images/create-png-from-html-in-c-step-by-step-guide/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# إنشاء PNG من HTML في C# – دليل برمجة كامل + +هل احتجت يوماً إلى **create PNG from HTML** في تطبيق .NET لكن لم تكن متأكدًا من أين تبدأ؟ لست وحدك—العديد من المطورين يواجهون هذه المشكلة عندما يحاولون تحويل صفحة ويب إلى صورة bitmap للبريد الإلكتروني، التقارير، أو الصور المصغرة. الخبر السار هو أنه باستخدام Aspose.HTML يمكنك تصيير HTML إلى PNG في بضع أسطر من الشيفرة، وستحصل أيضًا على القدرة على **convert HTML to image** مع تمويه عالي الجودة وتلميحات النص. + +في هذا الدليل سنستعرض العملية بالكامل: تحميل ملف HTML، تكوين خيارات التصيير، تمكين تلميحات النص، وأخيرًا **saving HTML as PNG**. في النهاية ستحصل على مقتطف قابل لإعادة الاستخدام يعمل على .NET 6+ ويمكن دمجه في أي تطبيق كونسول، خدمة ويب، أو مهمة خلفية. لا أدوات خارجية، لا حركات سطر أوامر—فقط C# نظيفة. + +## ما ستحتاجه + +قبل أن نبدأ، تأكد من تثبيت المتطلبات التالية: + +| المتطلبات | السبب | +|--------------|--------| +| **.NET 6 SDK** (أو أحدث) | يستهدف الكود .NET 6، لكن الإصدارات الأقدم تعمل مع تعديلات بسيطة. | +| حزمة **Aspose.HTML for .NET** عبر NuGet | توفر `HTMLDocument`، `ImageRenderingOptions`، ومحرك التصيير. | +| **ملف HTML تجريبي** (مثال: `sample.html`) | المصدر الذي تريد تحويله إلى PNG. | +| بيئة تطوير أو محرر (Visual Studio، VS Code، Rider…) | لكتابة وتشغيل الشيفرة. | + +يمكنك سحب المكتبة بالأمر المألوف: + +```bash +dotnet add package Aspose.HTML +``` + +هذا كل شيء—لا حاجة إلى ملفات تنفيذية أصلية إضافية أو تثبيتات على مستوى النظام. + +![صورة PNG الناتجة التي تم إنشاؤها من HTML – create png from html](placeholder.png "صورة PNG الناتجة التي تم إنشاؤها من HTML – create png from html") + +*(alt text: “صورة PNG الناتجة التي تم إنشاؤها من HTML – create png from html”)* + +## الخطوة 1 – تحميل مستند HTML (create PNG from HTML) + +أول شيء عليك فعله هو إعطاء Aspose.HTML ما يحتاج لتصيره. تقبل فئة `HTMLDocument` مسار ملف، عنوان URL، أو حتى سلسلة تحتوي على التعليمات البرمجية الخام. في معظم السيناريوهات يعمل الملف المحلي بشكل أفضل لأنك تستطيع إبقاء الأصول (CSS، الصور) بجانبه. + +```csharp +using Aspose.Html; +using Aspose.Html.Rendering.Image; + +// Load the HTML file you want to turn into a PNG +HTMLDocument htmlDoc = new HTMLDocument("YOUR_DIRECTORY/sample.html"); +``` + +> **لماذا هذا مهم:** تحميل المستند يقوم بتحليل DOM، حل عناوين URL النسبية، وتطبيق تسلسل CSS. إذا تخطيت هذه الخطوة وأدخلت التعليمات البرمجية الخام مباشرة، قد لا يتم العثور على الموارد الخارجية مثل الصور أو الخطوط، مما يؤدي إلى PNG فارغ أو غير مكتمل. + +## الخطوة 2 – تكوين خيارات التصيير (render html to png) + +الآن نخبر المحرك بحجم الناتج وما إذا كنا نريد تمويهًا. كائن `ImageRenderingOptions` هو المكان الذي تحدد فيه العرض، الارتفاع، DPI، وبعض علامات الجودة. + +```csharp +// Create rendering options and specify the desired size +ImageRenderingOptions renderingOptions = new ImageRenderingOptions +{ + Width = 800, // Target width in pixels + Height = 600, // Target height in pixels + UseAntialiasing = true, // Smooth edges for vector graphics + // You can also set DpiX/DpiY if you need higher resolution +}; +``` + +> **نصيحة احترافية:** إذا كنت بحاجة إلى صورة جاهزة لشاشات Retina، اضرب العرض/الارتفاع في 2 وضع `DpiX = 300` و `DpiY = 300`. ستظهر صورة PNG الناتجة حادة على الشاشات عالية الكثافة. + +## الخطوة 3 – تمكين تحسين النص (improve readability) + +عند تصغير النص إلى حجم بكسل صغير، قد تصبح الحروف غير واضحة. يوفر Aspose.HTML خاصية `TextOptions` التي تسمح لك بتفعيل التلميحات، مما يطابق الأحرف مع شبكة البكسل. + +```csharp +// Turn on text hinting for sharper small‑size fonts +renderingOptions.TextOptions = new TextOptions { UseHinting = true }; +``` + +> **لماذا التلميحات؟** تقلل التلميحات الضوضاء البصرية التي تظهر عندما يتم تحويل الخط إلى نقط على دقة منخفضة. إنها مفيدة بشكل خاص للوحة معلومات أو صور مصغرة في البريد الإلكتروني حيث كل بكسل مهم. + +## الخطوة 4 – تصيير وحفظ الصورة (save html as png) + +مع وجود المستند والخيارات جاهزة، الخطوة الأخيرة هي سطر واحد فقط: استدعِ `Save` على `HTMLDocument` وحدد مسار ملف ينتهي بـ `.png`. يختار Aspose.HTML تلقائيًا مشفر PNG بناءً على الامتداد. + +```csharp +// Render the HTML and write it out as a PNG file +htmlDoc.Save("YOUR_DIRECTORY/hinted.png", renderingOptions); +``` + +بعد تنفيذ هذا السطر، ستجد `hinted.png` في المجلد الذي حددته. افتحه بأي عارض صور—يجب أن ترى التمثيل البصري الدقيق لـ `sample.html`، بما في ذلك تنسيقات CSS، الصور المدمجة، والنص الحاد. + +### مثال عملي كامل + +نجمع كل ما سبق في برنامج كونسول بسيط يمكنك نسخه ولصقه ثم تشغيله: + +```csharp +using System; +using Aspose.Html; +using Aspose.Html.Rendering.Image; + +class Program +{ + static void Main() + { + // 1️⃣ Load the source HTML + HTMLDocument htmlDoc = new HTMLDocument("sample.html"); + + // 2️⃣ Set rendering size and quality + ImageRenderingOptions opts = new ImageRenderingOptions + { + Width = 800, + Height = 600, + UseAntialiasing = true + }; + + // 3️⃣ Enable text hinting for sharper fonts + opts.TextOptions = new TextOptions { UseHinting = true }; + + // 4️⃣ Render and save as PNG + htmlDoc.Save("hinted.png", opts); + + Console.WriteLine("✅ PNG created successfully – check hinted.png"); + } +} +``` + +شغّل البرنامج باستخدام `dotnet run`. إذا تم إعداد كل شيء بشكل صحيح، ستظهر رسالة التأكيد وستجد ملف PNG جديد بجوار الملف التنفيذي. + +## الاختلافات الشائعة وحالات الحافة + +فيما يلي بعض السيناريوهات التي قد تواجهها عند **render HTML as PNG** في العالم الحقيقي. + +| الحالة | طريقة التعامل | +|-----------|-----------------| +| **ملفات CSS/JS الخارجية محجوبة** | مرّر `ResourceLoadingOptions` مخصص إلى `HTMLDocument` يسمح بعناوين URL عن بُعد، أو دمج CSS مباشرة في HTML. | +| **تحتاج إلى خلفية شفافة** | ضع `renderingOptions.BackgroundColor = Color.Transparent;` قبل الحفظ. | +| **المحتوى الديناميكي (مثل JavaScript) يجب تقييمه** | استخدم `htmlDoc.RenderToBitmap` بعد استدعاء `htmlDoc.WaitForReadyState()`؛ Aspose.HTML يتضمن محرك JavaScript مدمج. | +| **صفحات متعددة → PNG طويل واحد** | كرّر عبر `htmlDoc.Pages` وادمج الصور المخرجة معًا، أو زد `Height` لتستوعب كل المحتوى. | +| **ضغط الذاكرة على الصفحات الكبيرة** | صِرّ إلى تدفق (`MemoryStream`) وتخلص من الكائنات فورًا، أو قسّم التصيير إلى بلاطات. | + +هذه التعديلات تسمح لك **convert HTML to image** بطريقة تتناسب مع متطلبات الأداء أو المظهر الخاصة بك. + +## نصائح الأداء (render html to png faster) + +1. **أعد استخدام كائنات `HTMLDocument`** عندما تحتاج إلى تصيير صفحات متعددة بنفس التخطيط—تحليل DOM مرة واحدة فقط يوفر CPU. +2. **خزن الخطوط المصدرة** عبر تعيين `renderingOptions.FontSettings` إلى مجموعة خطوط محملة مسبقًا؛ هذا يتجنب إعادة تحميل خطوط النظام في كل استدعاء. +3. **تجنّب DPI عالي** ما لم تكن بحاجة فعلًا إليه؛ صورة بدقة 300 DPI قد تكون أكبر بأربع مرات في الذاكرة وتستغرق وقتًا أطول للكتابة على القرص. + +## التحقق – هل نجح؟ + +بعد انتهاء البرنامج، افتح `hinted.png` وتحقق من المؤشرات البصرية التالية: + +- جميع أنماط CSS (الخطوط، الألوان، الهوامش) تظهر تمامًا كما في المتصفح. +- الصور المشار إليها في HTML موجودة؛ عادةً ما تُظهر الصور المفقودة عنصرًا نائبًا. +- النص يبدو حادًا، خاصةً في الأحجام الصغيرة، بفضل التلميحات المفعلة. + +إذا لاحظت أي شيء غير صحيح، تحقق من المسارات في HTML وتأكد من أن `YOUR_DIRECTORY` التي مررتها إلى `Save` قابلة للكتابة. + +## الخاتمة + +أنت الآن تعرف كيف **create PNG from HTML** باستخدام Aspose.HTML في C#. غطى الدليل تحميل HTML، تكوين خيارات التصيير، تمكين تلميحات النص، وأخيرًا **saving HTML as PNG** باستدعاء `Save` واحد. مع المثال القابل للتنفيذ بالكامل يمكنك دمج هذا المقتطف في خدمات ويب، مهام خلفية، أو أدوات سطح مكتب دون الحاجة إلى متصفحات ثقيلة. + +ما الخطوة التالية؟ جرّب التجارب مع الكلمات المفتاحية الثانوية التي قدمناها: + +- **Render HTML to PNG** بأبعاد مختلفة للصور المصغرة. +- **Convert HTML to image** دفعيًا لكاتالوغ منتجات. +- **Render HTML as PNG** بألوان خلفية مخصصة للعلامة التجارية. +- **Save HTML as PNG** مع الحفاظ على الشفافية للرسومات المتراكبة. + +كل من هذه التغييرات يبني على نفس الكود الأساسي، لذا ستتمكن من التكيف بسرعة. إذا واجهت مشاكل—مثل عدم تحميل الموارد الخارجية أو ارتفاع استهلاك الذاكرة—ارجع إلى جدول حالات الحافة أعلاه. نتمنى لك تصييرًا موفقًا، ولتكون صور PNG دائمًا ذات جودة بكسل‑مثالية! + +{{< /blocks/products/pf/tutorial-page-section >}} +{{< /blocks/products/pf/main-container >}} +{{< /blocks/products/pf/main-wrap-class >}} +{{< blocks/products/products-backtop-button >}} \ No newline at end of file diff --git a/html/arabic/net/html-document-manipulation/_index.md b/html/arabic/net/html-document-manipulation/_index.md index 5dca51c48..d6b3e545f 100644 --- a/html/arabic/net/html-document-manipulation/_index.md +++ b/html/arabic/net/html-document-manipulation/_index.md @@ -71,6 +71,8 @@ url: /ar/net/html-document-manipulation/ أطلق العنان لإمكانات تطوير الويب باستخدام Aspose.HTML for .NET. أنشئ مستندات HTML وحولها وتعامل معها بسهولة. ### [إنشاء HTML من سلسلة في C# – دليل معالج الموارد المخصص](./create-html-from-string-in-c-custom-resource-handler-guide/) تعرف على كيفية إنشاء مستند HTML من سلسلة نصية في C# باستخدام معالج موارد مخصص. +### [إضافة عنصر إلى الجسم – دليل C# كامل مع Aspose.HTML](./append-element-to-body-complete-c-guide-with-aspose-html/) +تعلم كيفية إضافة عنصر إلى جسم مستند HTML باستخدام Aspose.HTML في C# خطوة بخطوة. ## خاتمة diff --git a/html/arabic/net/html-document-manipulation/append-element-to-body-complete-c-guide-with-aspose-html/_index.md b/html/arabic/net/html-document-manipulation/append-element-to-body-complete-c-guide-with-aspose-html/_index.md new file mode 100644 index 000000000..248985409 --- /dev/null +++ b/html/arabic/net/html-document-manipulation/append-element-to-body-complete-c-guide-with-aspose-html/_index.md @@ -0,0 +1,273 @@ +--- +category: general +date: 2026-02-11 +description: إضافة عنصر إلى الـ body باستخدام Aspose.HTML في C#. تعلّم كيفية إنشاء + عنصر فقرة، ضبط وزن الخط إلى عريض، تعيين عائلة الخط إلى Arial، وتحديد حجم الخط عبر + CSS — كل ذلك في درس واحد. +draft: false +keywords: +- append element to body +- create paragraph element +- set font weight bold +- set font family arial +- define css font size +language: ar +og_description: إضافة عنصر إلى الجسم باستخدام Aspose.HTML. يوضح هذا الدرس كيفية إنشاء + عنصر فقرة، وتعيين وزن الخط إلى غامق، وتحديد عائلة الخط إلى Arial، وتعريف حجم الخط + في CSS. +og_title: إضافة عنصر إلى الـ Body – دليل C# الكامل +tags: +- Aspose.HTML +- C# +- DOM manipulation +title: إضافة عنصر إلى الـ Body – دليل C# الكامل مع Aspose.HTML +url: /ar/net/html-document-manipulation/append-element-to-body-complete-c-guide-with-aspose-html/ +--- + +{{< blocks/products/pf/main-wrap-class >}} +{{< blocks/products/pf/main-container >}} +{{< blocks/products/pf/tutorial-page-section >}} + +# إلحاق عنصر إلى الجسم – دليل C# كامل مع Aspose.HTML + +هل احتجت يومًا إلى **append element to body** في مستند HTML من C# وتساءلت لماذا تبدو الأمثلة دائمًا غير مكتملة؟ لست وحدك. في العديد من مقتطفات البدء السريع سترى فقرة تُضاف، لكن تفاصيل التنسيق—مثل جعل النص **set font weight bold** أو استخدام **set font family arial**—تُترك. + +في هذا الدرس سنستعرض سيناريو واقعي: إنشاء وسم `

`، تعريف نمطه (بما في ذلك **define css font size**)، وأخيرًا **append element to body** باستخدام Aspose.HTML. في النهاية ستحصل على ملف HTML يعمل بالكامل يمكنك إدراجه في أي صفحة ويب، وستفهم السبب وراء كل سطر من الشيفرة. + +## ما ستتعلمه + +- كيفية **create paragraph element** برمجيًا. +- الخطوات الدقيقة لـ **set font weight bold** و **set font family arial** باستخدام تعداد `WebFontStyle`. +- كيفية **define css font size** بالنقاط للحصول على طباعة دقيقة. +- أنظف طريقة لـ **append element to body** دون دمج سلاسل يدوي. +- نصائح، حالات حافة، ومثال كامل قابل للتنفيذ يمكنك نسخه ولصقه. + +لا تحتاج إلى مكتبات خارجية غير Aspose.HTML، وتعمل الشيفرة مع .NET 6+ (أو .NET Framework 4.7.2). لنبدأ. + +--- + +## الخطوة 1 – تثبيت Aspose.HTML وإعداد المشروع + +أولًا، تأكد من أنك تمتلك حزمة NuGet الخاصة بـ Aspose.HTML: + +```bash +dotnet add package Aspose.HTML +``` + +> نصيحة احترافية: استخدم أحدث نسخة مستقرة (في وقت كتابة هذا الدليل، **23.9.0**) للاستفادة من إصلاحات الأخطاء والميزات الجديدة في CSS. + +أنشئ تطبيقًا جديدًا من نوع console (أو أدمجه في مشروع موجود) وأضف توجيهات `using` التالية: + +```csharp +using Aspose.Html; +using Aspose.Html.Drawing; +``` + +هذه المساحات الاسمية تمنحك الوصول إلى `HTMLDocument` و `CSSStyleDeclaration` وتعداد `WebFontStyle` الذي سنحتاجه لاحقًا. + +## الخطوة 2 – تعريف نمط CSS: عائلة الخط، الحجم، الوزن، والمائل + +لماذا نعرّف كائن نمط بدلاً من كتابة سلسلة سمة `style` مباشرة؟ لأن `CSSStyleDeclaration` يتحقق من صحة أسماء الخصائص، يتعامل مع تحويل الوحدات، ويجعل التغييرات المستقبلية سهلة. + +```csharp +// Step 2: Build a CSS style block +var paragraphStyle = new CSSStyleDeclaration(); + +// Set the font family to Arial – this satisfies the “set font family arial” requirement +paragraphStyle.FontFamily = "Arial"; + +// Define the font size in points; “define css font size” is clearer than using pixels for print‑like output +paragraphStyle.FontSize = new CSSLength(14, CSSLengthUnit.Point); + +// Make the text bold – fulfills “set font weight bold” +paragraphStyle.FontWeight = WebFontStyle.Bold; + +// Optional: add italic for visual flair +paragraphStyle.FontStyle = WebFontStyle.Italic; +``` + +> **لماذا النقاط؟** النقاط غير معتمدة على الجهاز، مما يضمن نفس الحجم البصري على الشاشة وعند الطباعة. إذا كنت بحاجة إلى تصميم متجاوب، استبدل `CSSLengthUnit.Point` بـ `CSSLengthUnit.Px` أو `%`. + +## الخطوة 3 – إنشاء مستند HTML جديد + +يوفر لك Aspose.HTML واجهة برمجة تطبيقات نظيفة تشبه DOM، مشابهة لما تحصل عليه من `document` في JavaScript. + +```csharp +// Step 3: Initialize an empty HTML document +var htmlDoc = new HTMLDocument(); +``` + +في هذه المرحلة يحتوي المستند على بنية `` الحد الأدنى، جاهزة للتعديل. + +## الخطوة 4 – إنشاء عنصر الفقرة وتطبيق النمط + +الآن نقوم فعليًا **create paragraph element**. تُعيد طريقة `CreateElement` كائنًا من نوع `IHTMLElement` يمكننا إثرائه بالسمات والمحتوى الداخلي. + +```csharp +// Step 4: Build the

element +var paragraph = htmlDoc.CreateElement("p"); + +// Apply the previously built CSS style; CssText converts the declaration to a valid style string +paragraph.SetAttribute("style", paragraphStyle.CssText); + +// Insert the visible text +paragraph.InnerHTML = "Styled with WebFontStyle – bold, italic, Arial, 14pt."; +``` + +إذا فحصت `paragraphStyle.CssText`، سترى شيئًا مثل: + +``` +font-family: Arial; font-size: 14pt; font-weight: bold; font-style: italic; +``` + +هذه السلسلة هي بالضبط ما سيفسره المتصفح، لكننا تجنبنا الجمع اليدوي. + +## الخطوة 5 – إلحاق عنصر إلى الجسم + +هذه هي اللحظة التي انتظرتها: **append element to body**. هذا السطر الواحد يقوم بالعمل الشاق، بإدراج `

` في عقدة `` الخاصة بالمستند. + +```csharp +// Step 5: Append the styled paragraph to the document body +htmlDoc.Body.AppendChild(paragraph); +``` + +> **تنبيه حالة حافة:** إذا استدعيت `AppendChild` على عقدة تحتوي بالفعل على العنصر، سيتم نقل العنصر—not duplicated. هذا يمنع تكرار الفقرات عن طريق الخطأ عند التكرار. + +## الخطوة 6 – حفظ المستند والتحقق من النتيجة + +أخيرًا، احفظ ملف HTML على القرص حتى تتمكن من فتحه في أي متصفح: + +```csharp +// Step 6: Persist the HTML file +string outputPath = Path.Combine(Environment.CurrentDirectory, "StyledParagraph.html"); +htmlDoc.Save(outputPath); + +// Optional: launch the file automatically (works on Windows) +System.Diagnostics.Process.Start(new System.Diagnostics.ProcessStartInfo(outputPath) { UseShellExecute = true }); +``` + +### النتيجة المتوقعة + +فتح **StyledParagraph.html** يجب أن يعرض سطرًا واحدًا من النص: + +> *Styled with WebFontStyle – bold, italic, Arial, 14pt.* + +النص سيكون **bold**، **italic**، معروضًا بخط **Arial**، وحجمه **14 pt**. إذا فحصت المصدر، سترى: + +```html + + + + +

+ Styled with WebFontStyle – bold, italic, Arial, 14pt. +

+ + +``` + +هذا مستند نظيف ومتوافق مع المعايير تم إنشاؤه بالكامل من C#. + +## مثال كامل يعمل (جاهز للنسخ واللصق) + +فيما يلي البرنامج الكامل الذي يمكنك وضعه في `Program.cs`. لا تحتاج إلى ملفات أخرى. + +```csharp +using System; +using System.IO; +using Aspose.Html; +using Aspose.Html.Drawing; + +class Program +{ + static void Main() + { + // 1️⃣ Define CSS style (font family, size, weight, style) + var paragraphStyle = new CSSStyleDeclaration + { + FontFamily = "Arial", // set font family arial + FontSize = new CSSLength(14, CSSLengthUnit.Point), // define css font size + FontWeight = WebFontStyle.Bold, // set font weight bold + FontStyle = WebFontStyle.Italic // optional italic for demo + }; + + // 2️⃣ Create an empty HTML document + var htmlDoc = new HTMLDocument(); + + // 3️⃣ Build a

element and attach the style + var paragraph = htmlDoc.CreateElement("p"); + paragraph.SetAttribute("style", paragraphStyle.CssText); + paragraph.InnerHTML = "Styled with WebFontStyle – bold, italic, Arial, 14pt."; + + // 4️⃣ Append element to body + htmlDoc.Body.AppendChild(paragraph); + + // 5️⃣ Save the file + string output = Path.Combine(Environment.CurrentDirectory, "StyledParagraph.html"); + htmlDoc.Save(output); + Console.WriteLine($"HTML saved to: {output}"); + + // Open automatically (Windows only) + System.Diagnostics.Process.Start(new System.Diagnostics.ProcessStartInfo(output) { UseShellExecute = true }); + } +} +``` + +شغّل `dotnet run` وستحصل على ملف HTML جاهز للاستخدام. + +## أسئلة شائعة وحالات حافة + +### ماذا لو احتجت لإضافة فقرات متعددة؟ + +ما عليك سوى تكرار **Step 4** و **Step 5** داخل حلقة. تذكر أن كل استدعاء لـ `CreateElement("p")` يُعيد عقدة جديدة، لذا لن تعيد استخدام نفس العنصر عن طريق الخطأ. + +```csharp +for (int i = 1; i <= 3; i++) +{ + var p = htmlDoc.CreateElement("p"); + p.SetAttribute("style", paragraphStyle.CssText); + p.InnerHTML = $"Paragraph {i}"; + htmlDoc.Body.AppendChild(p); +} +``` + +### هل يمكنني استخدام ملفات CSS خارجية بدلاً من الأنماط المضمنة؟ + +بالطبع. استبدل سمة `style` المضمنة باسم فئة وأضف كتلة `