Document Structure Udacity Arabic English (auto-generated)

Document StructureYouTube↗ IA↗(long shot)
Education 7.2K views 24 likes 1 dislikes 23 Feb 2015

Udacity 651K subscribers United States YouTube↗

Click to Play Video

فلنكتفِ بهذا القدر من عناصر HTML الآن. حيث أرغب في التحدث عن

that's enough HTML elements for now I

هيكل وثيقة HTML فعلية سريعًا قبل

want to talk about the structure of an actual HTML document really quick

المتابعة. الآن، ما رأيناه من قبل هو مجرد

before we move on now what we've been seeing before is just little markup

،علامة بسيطة. لقد كنا نرى هذا بهذا الشكل. أي علامات صغيرة

we've been seeing things like this you

بضع علامات بسيطة صغيرة. ولكن وثيقة HTML المكتملة الفعلية

know a little text a few little simple tags but an actual complete HTML

تحتوي على أكثر من ذلك بكثير. ها هي وثيقة

document has quite a bit more in it here

HTML كاملة. لنتناول ذلك خطوة بخطوة، ولكن هذا هو

is a whole lot more HTML let's take this

شكل وثيقة HTML المكتملة. حيث يوجد لدينا أولاً DOCTYPE. وهذا

piece by piece but this is what a complete HTML document looks like first we have the doctype and this is what

يعبر عن نوع وثيقة HTML. وعادة ما تكون هذه

kind of of HTML this is this string

السلسلة الموجودة هنا أكثر

right here is used to be a lot more

تعقيدًا بكثير. وإذا قمتم بالبحث عن DOCTYPES، فستجدون

complex if you were to google for doc

العديد من الإجابات المختلفة هنا. ولكن الآن، ونحن

types you would see a lot of different

نستخدم HTML5، فهي تحتوي على نوع ومستند جيد

answers here but now that we're using html5 it has a nice clean simple doctype

.ونظيف، ألا وهو السلسلة HTML فقط. أمر في غاية البساطة، حسنًا

which is just the string HTML very

ثم يوجد لدينا علامة. ويتمثل ذلك في الأساس في

simple okay then we have a tag this is

وسم HTML المفتوح ووسم HTML المغلق. وهذا يحيط

the basically that the opening HTML tag and the closing HTML tag this surrounds

بكامل الجزء المتبقي من الوثيقة. وهذا هو كل ما تفعله

the entire rest of the document that's

أنها تحيط بالوثيقة بالكامل. الآن لدي هذه

all it does is it surrounds the entire document now we've got this other tag

العلامة الأخرى هنا، وهي علامة head. ويحتوي هذا الجزء من الوثيقة

here the head this part of the document

على نوع ما من بيانات التعريف، وأشياء عشوائية أخرى. وإذا قمتم

has kind of metadata and another random stuff if you were to include JavaScript

بتضمين لغة JavaScript وCSS، وCSS فتذكروا أننا

and CSS CSS remember we talked about is

تحدثنا عن هذا الأمر باعتباره الشيء الذي

the styling sort of stuff that would be

سيتم تضمينه في القسم الرئيسي. ولدينا الآن أيضًا

included in the head section you know we

هذه العلامة الصغيرة هنا، العنوان، وهي عبارة عن

also have this little tag here the title

عنوان الصفحة. وهو ما سيظهر في

and this is the title of the page this

الجزء العلوي من نافذة المتصفح، أو في

is what would appear in the top of your

علامة تبويب المتصفح، هذه السلسلة الموجودة هنا. ثم نجد لدينا

browser window or in the in your browser tab this string right here then we have

وسم body، وهي تمثل المحتويات الفعلية

the body tag and the body tag is actual

للوثيقة. ونحن نعمل في الأساس على

contents of the document and basically we've been we've been working just in

وسم body في هذا الدرس. وبالنسبة

the body tag in this lesson and for most

لمعظم هذه الدورة، سنركز فقط

of this course we're really just going

.على إنشاء المحتوى الذي يلائم المساحة الموجودة بين وسوم body

to be focusing on generating the content that fits between the body tags it's all

،وتُعد جميع هذه الأشياء الأخرى مهمة، وسترونها

this other stuff is important and you'll

وسنقوم بإرسالها. ولكنها

see it and we'll be you know we'll be sending it over the wire but it doesn't

لا تتغير في كثير من الأحيان، وهي بسيطة للغاية، ولكن

change very often and you know it's

وجودها مهم للغاية أيضًا. وبالرغم من ذلك، فإن كل الأشياء المثيرة

pretty simple but it is important for it to be there all the interesting stuff

تتم بين وسوم body. حسنًا، لنلق نظرة على وثائق

though happens between the body tags

HTML أخرى، حيث تمتلك هيكلاً يمكن تصوره

okay let's take another view of HTML documents they have a structure that can

،هكذا. تحتوي وثيقة HTML على قسم head

be visualized like this an HTML document this whole thing has a head section and

وهو المكان الذي يوجد به العنوان، والمراجع إلى أي ملفات CSS، وملفات

that's where we have our title references to any CSS files any

Java script، وذلك النوع من الأشياء. وبعد ذلك

JavaScript files and that sort of stuff

لدينا قسم body الذي يحتوي على المحتويات الفعلية

and then we have the body section and this is where the actual

للوثيقة، وهي الأشياء التي ترونها على الشاشة. ومن هنا

of the document the stuff that you see

يأتي ذلك. وسنركز بالقدر الأكبر في هذه الدورة

on the screen this is where that comes from and in this course we're mostly

على هذا الجزء من وثيقة HTML. فقط القسم body

going to focus on this part of an HTML document just the body section and

،وهناك العديد من أشكال المحتوى التي يمكن وجودها في هذا المكان. حسنًا

there's a lot of content that can go in

سنناقش باختصار اللغتين CSS وJavaScript وكيف أنهما

there well you know discuss briefly you know CSS and JavaScript and how they fit

يلائمان أي شيء. ولكن في الجزء الأكبر من الدورة سنقوم

into everything but for the most part

.بإنشاء المحتويات، التي تمثل القسم body في وثيقة HTML

we're going to be generating the contents the body of an HTML document

Similar videos:

Making Links
Udacity
53.9K views 21 likes 0 dislikes 23 Feb 2015100% match

Italics
Udacity
49.1K views 16 likes 2 dislikes 23 Feb 2015100% match

Interview with Neil - Web Development
Udacity
4.5K views 16 likes 0 dislikes 23 Feb 2015100% match

Dynamic Content - Web Development
Udacity
6.1K views 2 likes 0 dislikes 23 Feb 2015100% match

Web 简介
 Udacity
25.7K views 60 likes 0 dislikes 23 Feb 2015100% match

Paragraph Tag Solution - Web Development
Udacity
4.6K views 3 likes 0 dislikes 23 Feb 2015100% match

Inline Vs Block
Udacity
17.3K views 139 likes 5 dislikes 23 Feb 2015100% match

The Method Attribute - Web Development
Udacity
9.6K views 14 likes 8 dislikes 22 Apr 2012100% match

Cache Architecture - Web Development
Udacity
7.2K views 16 likes 1 dislikes 27 May 2012100% match

Course Outline - Web Development
Udacity
46.2K views 169 likes 0 dislikes 23 Feb 2015100% match

Best Browser Solution - Web Development
Udacity
9.6K views 22 likes 1 dislikes 23 Feb 2015100% match

Most Common Method - Web Development
Udacity
9.7K views 5 likes 0 dislikes 23 Feb 2015100% match

What Is Your Birthday? - Web Development
Udacity
5.3K views 4 likes 0 dislikes 22 Apr 2012100% match

Shopping List Take 1 - Web Development
Udacity
841 views 1 likes 0 dislikes 23 Feb 2015100% match

Bold Tag - Web Development
Udacity
53K views 29 likes 0 dislikes 23 Feb 2015100% match

Bold Tag Solution - Web Development
Udacity
6.1K views 5 likes 0 dislikes 23 Feb 2015100% match

App Server Architecture - Web Development
Udacity
14K views 52 likes 5 dislikes 27 May 2012100% match

Missing End Tag
Udacity
43K views 15 likes 1 dislikes 23 Feb 2015100% match

Google App Engine Solution - Web Development
Udacity
4.7K views 8 likes 8 dislikes 25 Apr 2012100% match

User Input - Web Development
Udacity
7.7K views 3 likes 0 dislikes 22 Apr 2012100% match

Part 2 - Web Development
Udacity
643 views 2 likes 0 dislikes 07 May 2012100% match

Get Solution - Web Development
Udacity
4.9K views 5 likes 0 dislikes 23 Feb 2015100% match

Valid Headers - Web Development
Udacity
7.9K views 1 likes 0 dislikes 23 Feb 2015100% match

Span and Div
Udacity
50.3K views 27 likes 1 dislikes 23 Feb 2015100% match

Rot13 - Web Development
Udacity
9.3K views 46 likes 8 dislikes 23 Apr 2012100% match

Local Hosting - Web Development
Udacity
4.9K views 5 likes 0 dislikes 27 May 2012100% match

Differences Between Get and Post - Web Development
Udacity
78.3K views 516 likes 18 dislikes 22 Apr 2012100% match

Reddit - Web Development
Udacity
5.7K views 15 likes 0 dislikes 27 May 2012100% match

Frameworks - Web Development
Udacity
28.7K views 154 likes 25 dislikes 23 Feb 2015100% match

Security - Web Development
Udacity
5.7K views 64 likes 0 dislikes 23 May 2012100% match

Settings Privacy About Contact Donate