• 0
هالي الدهوكي

سوال بخصوص opacity

سؤال

مرحبا يا اعضاء كيف الحال إن شاء الله بخير

لدي سوال حول opacity Css

شباب عندي تايبل table

و بدي لهل تايبل البوردر border بتاع هل تايبل يصبح opacity يعني فقط البوردر border يصبح بشكل خيال و ما يوجد تحته من صور او كلام يضهر ...

انا جربت هل طريقة


<table style="opacity:0.5;" border="5" cellpadding="0" cellspacing="0">
<td>
hi
<td>
<table>

لكن كل التايبل يصير خيالي لكن انا بدي بس البوردر بتاعة كيف يمكن فعل هذا

مثل تنبيهات فيسبوك عندما تضهر بشكل جي كويري لاحض البوردر border بتاعة بشكل حلو صاير خيالي ....

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

13 إجابة على هذا السؤال .

  • 0

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

287337359.jpg

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

على كل لعمل مثل التصميم السابق تحتاج إلى 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;

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم

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

يمكنك الإستعانة بهذا الرابط 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);
}


0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

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

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

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

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

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

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

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

position : relative

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

z-index

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

<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>

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

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

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

global

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

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

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

  • يستعرض القسم حالياً   0 members

    لا يوجد أعضاء مسجلين يشاهدون هذه الصفحة .