اعتقد أن أفضل طريقة لكي تتعلم هي أن تبدأ بالتجربة والتطبيق .
تطبيقي لشرح فيديو يوتيوب :
- نرسم مخطط الصفحة المرغوب
- سأنشيء ملف على سطح المكتب وأنشيء بداخله مستندين /
- داخل الجسم سأنشيء فئات ( متصلة ولها علاقة بما هشتقته في المخطط )
#nav
{
}
#main
{
}
#footer
{
}
تطبيقي لشرح فيديو يوتيوب :
- البرنامج المستخدم هو Notepad
موقع البرنامج :
- نرسم مخطط الصفحة المرغوب
- سأنشيء ملف على سطح المكتب وأنشيء بداخله مستندين /
1-مستند HTML يكون هو الصفحة الرئيسية واسميها index.html
2- مستند css
- داخل الجسم سأنشيء فئات ( متصلة ولها علاقة بما هشتقته في المخطط )
- سيكون لدينا ستة أقسام : (1- الحاوية الاساسية , 2- الرأس 3- الرئيسي 4- القدم )
بداخل قسم الرئيسي يوجد قمسين : 5- المحتوى 6- النافقيشن (التنقل)
بداخل قسم الرئيسي يوجد قمسين : 5- المحتوى 6- النافقيشن (التنقل)
سأكتب في اللسان : my website
وما يظهر في شريط المتصفح أو (اللسان) هو ما يقع في وسم (عنوان) والواقع في وسم (الرأس) .
وسيكون الوسم بالشكل التالي :
<head>
<title> <h1> My Website </h1> </title>
</head>
<title> <h1> My Website </h1> </title>
</head>
<body>
<div id="container"> </div>
<div id="header"> <h1> الرأس هنا موقعي </h1>
</div>
<div id="content"> </div>
<div id="nav">
<h1> الملاحة أو التنقل </h1>
</div>
<div id="main">
<h1> الصفحة الرئيسية </h1>
</div>
<div id="footer"> <h1> التذييل </h1>
copyright © 2015 million magazine
</div>
</body>
<div id="container"> </div>
<div id="header"> <h1> الرأس هنا موقعي </h1>
</div>
<div id="content"> </div>
<div id="nav">
<h1> الملاحة أو التنقل </h1>
</div>
<div id="main">
<h1> الصفحة الرئيسية </h1>
</div>
<div id="footer"> <h1> التذييل </h1>
copyright © 2015 million magazine
</div>
</body>
_________________
أذهب لمستند (ورقة الانماط الذي أسميته style.css )
سأجهزعليها مبدئيا من جعلنا له هوية من أقسام في جسم الـ HTML
body
{
}
#container
{
}
#header
{
}
#content
{
}
{
}
#container
{
}
#header
{
}
#content
{
}
#nav
{
}
#main
{
}
#footer
{
}
_________________
أعود لمستند HTML
وفي قسم الرأس أكتب الوسم الذي سيربط لي مستند ورقة الأنماط
وسيكون الوسم كالتالي :
<link rel="stylesheet" typle="text/css" href="meem.css"/>
حيث style.css
هي اسم مستند ورقة الأنماط
ليست هناك تعليقات:
إرسال تعليق