سوال بخصوص opacity

يا شباب و هذا مثال على طلبي :)

لم يعد الجدول يدخل في مجال التصميم , الجدول لعرض بيانات مجدوله فقط لا غير أما التصيميم فتحتاج إلى وسوم أخرى كثيره وكل لها عمله وما تريده يدخل تحت وسم div

اخي يعني ما الحل ؟ كيف يمكنني فعل ذالك ؟ اتمنى تعطوني فكرة و مع فعلها و شكرا الك و لردك يا غالي

الحل هو أن تدرس كيفيه عمل التصاميم وعلى الاقل تحاول عمل ماتراه من خلال النظر إلى شيفرات المواقع الكبيره والمميزه

على كل لعمل مثل التصميم السابق تحتاج إلى div رئيسي وبداخل هذه الطبقه (div) تقوم بعمل طبيقتين الأولى هي الشفافه والثانيه يتم وضع التصميم الذي تريده فيها المثال أشبه بالتالي :

 <div id="global">
   <div id='shadow_div'></div>
   <div id="content_div">here your code or design ... </div>
 </div>

في الستايل تحتاج لطبقة الظل أوامر أهمها :

      opacity:0.5;
      background: #333;
      border-radius:10px;

السلام عليكم

--------------------------

يمكنك الإستعانة بهذا الرابط http://css3gen.com/box-shadow/ لإنشاء الظل , و تكون النتيجة كالتالي

table {
-webkit-box-shadow: 7px 7px 5px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    7px 7px 5px rgba(50, 50, 50, 0.75);
box-shadow:         7px 7px 5px rgba(50, 50, 50, 0.75);
}

اخواني مهدي و بسام

انا لا اقصد الشادو ولا اقصد بوردر راديوس Border Radius ولا shadow

انني اقصد بما وضحته بال صورة

يعني اريد اعمل border لل table او div الخاص بي و يكون البوردر 20 بكسل مثلا و يكون مضلل على دار مدار ال table و ليس شادو ولا بوردر راديوس انني اعرف كل هذا و شكرا مجداا و تابعوا الصورة بما اقصد ...

اخي هالي قلت لك سابقا انسى الجدول أنت تبقى في دائرة الجدول والبوردر والخصائص التي تعرفها قديما ولا تفكر في دراسة الجديد وقد قلت لك ذلك مسبقا أيضا, نظرت إلى الصورة وهي واضحة ولن أعطيك الحل مجانا أريد منك التعلم فهو أهم من أن تأخذ الأمور جاهزه في كل مرة.

أيضا سأعيد ماذكرته بطريقه مفصله أكثر قليلا .

طبقة رئيسيه بداخلها طبقتين الأولى هي البوردر الشفاف الذي تريده والثانيه هي محتوى النافذه أو الصندوق

الآن تججعل الطبقتين الداخليات عائمات

position : relative

وتجعل الطبقه الشفافه (التي ستصبح بوردر) تحت طبقة المحتوى مع تعديل العرض والطول وجعلها تحت الطبقة السابقة يتم عن طريق الخاصيه

z-index

اخي بسام في كل مواقع اذا احدا يطلب فكرة سيعطون الكود الخاص بال فكرة ... و اتمنى ان تعطيني الاكواد لأتعلم من الفكرة و انني لم انسخ و الصق لكن كل كود أأتي به اتعمله لأكون مستعدا لكتابته لمرة القادمة و شكرا

 <style>
 #global{
   height: 300px;
   margin: 0 auto;
   width: 300px;
 }
  #shadow_div{
    background-color: #333333;
    border-radius: 10px;
    height: 300px;
    opacity: 0.5;
    position: relative;
    width: 300px;
}
 #content_div{
    background-color: #FFFFFF;
    border-radius: 5px;
    height: 280px;
    left: 10px;
    position: relative;
    top: -290px;
    width: 280px;
 }
 </style>


<div id="global">
   <div id='shadow_div'></div>
   <div id="content_div">here your code or design ... </div>
 </div>

ربما تواجه مشكله في الإرتفاع والعرض للنافذه بناء على المحتوى :( إذا كان المحتوى متغير يجب أن تفكر في طريقه أخرى , عادة يتم استخدام الجافاسكريبت لمثل هذه الامور , ليس لدي وقت كافي لحل المشكله الآن ... جرب وأخبرني بالنتائج

اخي فكرة رائعة و جميلة لكن هل يمكنني استخدام الكود absolute بدون مشاكل بدل relative

لانه هذه القائمة ستضهر بشكل JQ جي كويري و تصبح فوق كل شئ في الموقع مثل الفيسبوك تماما

نعم تستخدم ماتريد على الطبقة الرئيسيه

global

نعم اخي جربت هذا و تم الحل :) و شكرا لك اخي الكريم على المساعدة الجميلة منك و اي خدمة تصميم فلاش او فوتوغراف انا مستعد لك و للمنتدى الراقي ايضا