الاثنين، 6 أكتوبر 2014

الأساليب (Styles)

المشاركة رقم:60
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل 5  HTML5 
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From

http://www.w3schools.com

الأساليب (Styles) في HTML
HTML Styles
استخدمت الاساليب لتغير لون الخلفية لهذه المشاركة
I use Styles to change the background color for this post
- عناصر التنسيق في HTML
في المشاركة السابقة، تعلمت عن عناصر التنسيق في HTML.
عناصر التنسيق هي عناصر HTML خاصة ولها معناها الخاص.
تم تصميم عناصر التنسيق لعرض أنواع خاصة من النص، مثل النص المهم، النص البارز، السفلي،و العلوي.
- HTML Formatting Elements
In the previous post, you learned about HTML formatting elements.
Formatting elements are special HTML elements with a special meaning.
Formatting elements were designed to display special types of text, like important text, emphasized text, subscripts, and superscripts.
---------------------------------------------------------
- أسلوب HTML
الأساليب في HTML ليس لها علاقة بشيء  مع عناصر التنسيق.
الأسلوب هو عبارة عن تغيير أو إضافة أسلوب لعنصر HTML موجود.
كل عناصر HTML لها أسلوب افتراضي (لون خلفية أبيض، لون النص أسود ...).
تغيير الأسلوب الافتراضي لعنصر HTML، يمكن أن يحدث باستخدام سمة الأسلوب.
- HTML Styling
HTML styling has nothing to do with formatting elements.
Styling is about changing or adding the style of existing HTML elements.
Every HTML element has a default style (background color is white, text color is black ...)
Changing the default style of an HTML element, can be done with the style attribute.

Example:
<!DOCTYPE html>
<body style="background-color:lightgrey">
<h1>My Frist Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
---------------------------------------------------------
قراءة المزيد Read More »
مرسلة بواسطة في ليست هناك تعليقات:

الأحد، 5 أكتوبر 2014

التعليقات Comments

المشاركة رقم:59
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل 5  HTML5 
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From

http://www.w3schools.com

- التعليقات في HTML
- HTML Comments

- تستطيع إضافة التعليقات لكود HTML الخاص بك باستخدام التركيب التالي:
<!-- write your comments here -->
- You can add comments to your HTML source by using the following syntax:
<!-- write your comments here -->
---------------------------------------------------------
- لا يتم عرض التعليقات باستخدام المتصفح، لكنها يمكن ان تساعد في:
توثيق مستند HTML الخاص بك، مع التعليقات يمكنك وضع إخطارات ورسائل تذكير في مستند HTML الخاص بك.
- Comments are not displayed by the browser, but they can help in:
document your HTML, With comments you can place notifications and reminders in your HTML.
---------------------------------------------------------
مثال Example
<!-- This is a comment -->
<p>This is a paragraph.</p>
<!-- Remember to add more information here -->
---------------------------------------------------------
قراءة المزيد Read More »
مرسلة بواسطة في ليست هناك تعليقات:

الاثنين، 8 سبتمبر 2014

تنسيق النص في HTML

المشاركة رقم:58
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل 5  HTML5 
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From

http://www.w3schools.com
تنسيق النص في HTML
HTML Text Formatting

- وسوم التنسيق في HTML
تستخدم HTML وسوم مثل <b> و <i>، لإخراج التنسيق، مثل  النص الغامق أو المائل.
وسوم HTML هذه تدعى وسوم التنسيق.
 ( لمزيد من وسوم التنسيق انظر إلى المرجع الموجود أسفل هذه المشاركة).
- HTML Formatting Tags
HTML uses tags like <b> and <i> for formatting output, like bold or  italic text.
These HTML tags are called formatting tags .
(look at the bottom of this post for a complete reference).
---------------------------------------------------------
- مثال Example
<!DOCTYPE html>
<html>
<body>
<p><b>This text is bold</b></p>
<p><strong>This text is strong</strong></p>
<p><i>This text is italic</i></p>
<p><em>This text is emphasized</em></p>
<p><code>this is computer outputt</code></p>
<p>This is <sub>subscript</sub> and <sup>superscript</sup></p>
</body>
</html>
عند تشغيل كود الـ HTML هذا، في متصفحك ستكون النتيجة كالتالي:
When you run this HTML code, in your browser the result will be like this:


قراءة المزيد Read More »
مرسلة بواسطة في ليست هناك تعليقات:

الاثنين، 18 أغسطس 2014

الفقرات في HTML

المشاركة رقم:57
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل 5  HTML5 
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From

http://www.w3schools.com

الفقرات في HTML
HTML Paragraphs

تُقَّسم مستندات HTML إلى فقرات.
HTML documents are divided into paragraphs.

- الفقرات في HTML
يتم تعريف الفقرات باستخدام الوسم <p>.
مثال:
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
- HTML Paragraphs
Paragraphs are defined with the <p> tag.
Example
<p>This is a paragraph</p>
<p>This is another paragraph</p>
---------------------------------------------------------
قراءة المزيد Read More »
مرسلة بواسطة في ليست هناك تعليقات:

ترويسات (رؤوس) أو عناوين HTML

المشاركة رقم:56
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل 5  HTML5 
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From

http://www.w3schools.com

ترويسات (رؤوس) أو عناوين HTML
HTML Headings

العناوين مهمة في مستندات HTML
Headings are important in HTML documents.

-عناوين HTML
يتم تعريف العناوين باستخدام الوسوم <h1> إلى <h6>.
<h1> يُعرف العنوان الأكثر أهمية. <h6> يُعرف العنوان الأقل أهمية.
مثال:
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
- HTML Headings
Headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the least important heading.
Example
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
---------------------------------------------------------

قراءة المزيد Read More »
مرسلة بواسطة في ليست هناك تعليقات:

سمات HTML

المشاركة رقم:55
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل 5  HTML5 
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From
http://www.w3schools.com

سمات HTML
HTML Attributes

السمات تزود معلومات إضافية عن عناصر HTML.
Attributes provide additional information about HTML elements.
---------------------------------------------------------
- سمات HTML
* عناصر HTML يمكن أن تتضمن سمات
* السمات تزود معلومات إضافية عن عنصر
* السمات دائماً محدد في وسم البداية
* تأتي السمات على شكل مزدوج اسم/قيمة مثل: name="value"
- HTML Attributes
* HTML elements can have attributes
* Attributes provide additional information about an element
* Attributes are always specified in the start tag
* Attributes come in name/value pairs like: name="value"
---------------------------------------------------------
قراءة المزيد Read More »
مرسلة بواسطة في ليست هناك تعليقات:

الجمعة، 15 أغسطس 2014

عناصر HTML

المشاركة رقم:54
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل 5  HTML5 
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From
http://www.w3schools.com

عناصر HTML
HTML Elements

- عناصر HTML
عناصر HTML تكتب باستخدام وسم البداية و وسم النهاية والمحتويات تكون بينهما
عنصر HTML هو كل شيء من وسم البداية إلى وسم النهاية
بعض عناصر HTML ليس لها وسم نهاية

- HTML Elements
HTML elements are written with a start tag, with an end tag, with the content in between:
<tagname>content</tagname>
The HTML element is everything from the start tag to the end tag:
<p>My first paragraph.</p>

Some HTML elements do not have an end tag.



---------------------------------------------------------
- وسم البداية غالبا ما يقال عنه.
وسم الفتح
 - The start tag is often called the. 
opening tag
---------------------------------------------------------
- وسم النهاية غالبا ما يقال عنه.
وسم النهاية
- The end tag is often called the. 
closing tag
---------------------------------------------------------
قراءة المزيد Read More »
مرسلة بواسطة في هناك تعليق واحد:

أساسيات HTML

المشاركة رقم:53
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل 5  HTML5 
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From

http://www.w3schools.com
أساسيات HTML
HTML Basics

- مستندات HTML
كل مستندات HTML يجب أن تبدأ بتعريف النوع: <!DOCTYPE html>.
مستند HTML نفسه يبدأ بـ <html> وينتهي بـ </html>.
الجزء المخفي من مستند HTML هو بين <body>  و </body>.
- HTML Documents
All HTML documents must start with a type declaration: <!DOCTYPE html>.
The HTML document itself begins with <html> and ends with </html>.
The visible part of the HTML document is between <body> and </body>.

مثال Example
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My First paragraph.</p>
</body>
</html>

---------------------------------------------------------
- عناوين HTML
يتم تعريف أو الإعلان عن عناوين HTML بالوسوم من <h1> إلى <h6>
مثال
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
- HTML headings
HTML headings are defined with the <h1> to <h6> tags.
Example
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
---------------------------------------------------------
- الفقرات في HTML
يتم تعريف الفقرات في HTML  بواسطة الوسم <p>
مثال
<p>This is a paragraph.</p>
<p>this is another paragraph.</p>
- HTML Paragraphs
HTML paragraphs are defined with the <p> tag.
Example
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
---------------------------------------------------------
- روابط HTML
يتم تعريف روابط HTML بواسطة الوسم <a>
مثال
<a href="http://www.w3school.com">This is a link</a>
- HTML Links
HTML links are defined with the <a> tag.
Example
<a href="http://www.w3schools.com">This is a link</a>
---------------------------------------------------------
- الصور في HTML
يتم تعريف الصور في HTML بواسطة الوسم <img>
مثال
<img src="w3school.jpg" alt="w3school.com" width="104" height="142">
- HTML Images
HTML images are defined with the <img> tag.
Example

<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
مرسلة بواسطة في ليست هناك تعليقات:

الثلاثاء، 12 أغسطس 2014

محررات إتش تي إم إل HTML Editors

المشاركة رقم:52
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل 5  HTML5 
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From
http://www.w3schools.com

 محررات إتش تي إم إل   HTML Editors

كتابة HTML باستخدام برنامج المفكرة أو محرر النصوص

Write HTML Using Notepad or TextEdit

- يمكن تحرير HTML بواسطة محررات HTML احترافية مثل:
* Adobe Dreamweaver
* Microsoft Expression Web
* CoffeeCup HTML Editor
على أية حال، لتعلم HTML يوصى باستخدام محرر نصوص مثل Notepad لأنظمة ويندوز أو TextEdit للماك.
محرر أو محررات HTML هي البرامج المستخدمة لكتابة تعليمات HTML

- Write HTML Using Notepad or TextEdit
HTML can be edited by using a professional HTML editor like:
* Adobe Dreamweaver
* Microsoft Expression Web
* CoffeeCup HTML Editor
However, for learning HTML we recommend a text editor like Notepad (PC) or TextEdit (Mac).
---------------------------------------------------------
قراءة المزيد Read More »
مرسلة بواسطة في ليست هناك تعليقات:

الاثنين، 11 أغسطس 2014

مقدمة إلى HTML5

المشاركة رقم:51
سلسلة احتراف برمجة صفحات الويب  Web Pages Programming Tutorial
إتش تي إم إل  HTML5  
_________________________________
منقول ومترجم للعربية من Moved and Translated to Arabic From
http://www.w3schools.com

مقدمة إلى HTML5  
HTML5 Introduction
- مثال HTML Example

<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>my first paragraph.</p>
</body>
</html>
---------------------------------------------------------
-  توضيح المثال.
* كلمة DOCTYPE يتم من خلالها تحديد نوع المستند والإعلان عنه أو تحديده
* النص بين <html> و </html> يصف صفحة الويب
* النص بين <body> و </body> هو الجزء المخفي من الصفحة أو ما يتم خلف الكواليس عند تشغيل
   الصفحة  
* النص بين <h1> و </h1> يُعرض كعنوان
* النص بين <p> و </p1> يُعرض كفقرة
- Example Explained
* The DOCTYPE declaration defines the document type
* The text between <html> and </html> describes the web page
*The text between <body> and </body> is the visible page content
* The text between <h1> and </h1> is displayed as a heading
*The text between <p> and </p> is displayed as a paragraph
---------------------------------------------------------
قراءة المزيد Read More »
مرسلة بواسطة في ليست هناك تعليقات:
الاشتراك في: الرسائل (Atom)