توزيع الواجهات:$:$ التنسيق تم على قطعة دون غيرها..أكواد+صورة

أمل · 03-20-2011

السلام عليكم
مساء الخير
بخصوص الواجهات
استغربت إن التطبيق من تلوين وهوفير ونسيق ..الخ
ماتم إلا على جزئية وحده فقط
والصورة في المثال

وهذه الاكواد

كود PHP:


			
body{font-family:Tahoma, Geneva, sans-serif;
font-size:14px;
background-color:#FFC;
color:#366;
direction:rtl;
}
a{text-decoration:none;
}
*
{padding:0;
margin:0;
outline:0;
}
.header1
        {background:url(images/a_02.gif) repeat-x;
height:196px;
}
.header2
{background:url(images/a_01.gif); n0-repeat;
height:196px;
width:382px;
float:left;
}
.header3
{background:url(images/a_03.gif) no-repeat;
height:196px;
width:371px;
float:right;
position:relative;
}
a.ra1{
 position:absolute;
 height:20px;
 width:58px;
 left:301px;
 bottom:20px;
}
a.ra2{
 position:absolute;
 height:18px;
 width:59px;
 left:233px;
 bottom:20px;
}
a.ra3{
 position:absolute;
 height:18px;
 width:59px;
 left:165px;
 bottom:20px;
}
a.ra4{
 position:absolute;
 height:18px;
 width:59px;
 left:93px;
 bottom:20px;
}
#side{
 width:800px;
 margin:auto;
 background-color:#686152;
 color:#FF;
 border:1px solid #300;
 clear:both;
 height:100%;
 overflow:hidden;
}
.amal-khaled{
 float:right;
 padding:2px;
 border-left:1px solid #333;
}
.amal-khaled h3{
 font-family:Arial, Helvetica, sans-serif;
 font-size:14px;
 border:1px solid #030;
 margin:0px;
 padding:2px;
 background-color:#366;
 color:#FFC;
}
.amal-khaled ul li{
 list-style:circle;
 padding:2px;
 background-color:#FFC;
 
}
.amal-khaled ul li:hover{
 background-color:#0FF;
 color:#960;
 padding:1px;
}
.amal-khaled ul li a{
 display:block;
 color:#06C;
}
.amal-khaled ul li a:hover{
 color:#33C;
}
#side p{
 margin-right:2px;
}

قناص جوبا · 03-20-2011

وعليكم السلام
مساء الخير

طيب اين الاكواد الخاصه بال html الكلاسات يعنى

أمل · 03-20-2011

اهلا: )

تفضل

كود PHP:


			
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>موقع المصممة أمل خالد</title>
<meta name="description" content="موقع شخصي لتقديم خمات التصميم والتوزيع "/>
<meta name="keywords" content="?موقع،أمل،خالد،تصميم،توزيع،برمجة،هاك،تطوير"/>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<div id="amal-khaled"><!--amal-khaled-->
<div class="header1">
<div class="header2"></div>
<div class="header3">
<a class="ra1" href="#" title="الرئيسية" target="_self"></a>
<a class="ra1" href="#" title="المنتدى" target="_self"></a>
<a class="ra1" href="#" title="اعمالنا" target="_self"></a>
<a class="ra1" href="#" title="اتصل بنا" target="_self"></a>
</div>
</div><!--End header-->
<br/><!--berak-->
<div id="side"><!--side-->
<div class="amal-khaled">
<h3>من نحن</h3>
<p>موقع شخصي متخصص في تقديم خدمات التصميم</p>
</div>
<div class="amal-khaled">
<h3>أقسام الموقع</h3>
<ul>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
</ul>
</div>
<h3>أقسام الموقع</h3>
<ul>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
</ul>
</div>
<h3>أقسام الموقع</h3>
<ul>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
<li><a href="#">المنتدى</a></li>
</ul>
</div>
</div><!--End-->
</body>
</html>

قناص جوبا · 03-20-2011

المفروض قبل كل <h3> يكون فيه

كود PHP:


			
<div class="amal-khaled">

علشان التنسيق يتطلبق على كله

أمل · 03-20-2011

الله يعطيك العافيه ضبطت: )

لأني دي المرة الرابعه الي أكرر فيها للدرس الثالث

حتى اتجاوز أي اخطاء حأوقع فيها

ربي يبارك فيك: )

قناص جوبا · 03-20-2011

تمام شئ كويس التكرار وايضا الدوره الجديده هيكون فيه تطبيقات كثيره على اللى فات واكثر كمان وهتفيدك ان شاء الله
بالتوفيق
يغلق للانتهاء ،،

أدوات الموضوع
مشاهدة صفحة طباعة الموضوع أرسل هذا الموضوع إلى صديق
انواع عرض الموضوع
العرض العادي الانتقال إلى العرض المتطور الانتقال إلى العرض الشجري

المواضيع المتشابهه
الموضوع	كاتب الموضوع	المنتدى	مشاركات	آخر مشاركة
موقع رائع جدا لصنع أكواد Css	السيد المصرى	فى بى ايجى لدروس وشروحات تصميم الاستايلات	1	03-18-2011 06:58 PM
[طلب] كيف اوزع الواجهات بتقنية css	أمل	فى بى ايجى للحلول و المشاكل و الطلبات	5	11-27-2010 11:02 PM
[مشكلة] توزيع هيدر غير متمدد::قطعة واحده::بcss	أمل	مشاكل واستفسارات الاستايلات	2	10-20-2010 01:20 AM
[استفسار] واجهة موقعي وكيفية تقطيعها لدورة توزيع الواجهات	أمل	فى بى ايجى للحلول و المشاكل و الطلبات	1	10-15-2010 03:04 PM
[طلب] هاكـ التنسيق	мŏнаммed	فى بى ايجى للحلول و المشاكل و الطلبات	9	07-03-2010 12:12 PM

فى بى ايجى التطويرية
موقع تكويد	مركز رفع صور وملفات	مدونه فى بى ايجى	منتدى المشاكل	منتدى مجانى
معرض استايلات	دليل مواقع \| اضف موقعك	استضافه مجانيه	اعمال فى بى ايجى	دوره اداره الموقع
دوره تصميم الاستايلات	منتديات القمة إنفو	تبادل اعلانى	تبادل اعلانى	تبادل اعلانى

رسالة مدير الموقع

دورة تصميم قالب ورد بريس بلوحة تحكم
قريبا مفاجئات ودروس برمجية متنوعه