الأخبار التكنولوجية والاستعراضات والنصائح!

أفضل عطلات وسائل التواصل الاجتماعي في يناير

ستساعدك المقالة التالية: أفضل عطلات وسائل التواصل الاجتماعي في يناير

التنقل > ul > li > a { padding-top:10px; الحشو السفلي: 10 بكسل؛ } .et-db #et-boc .et-l .diviwp-header-2 .et_pb_menu–with-logo .et_pb_menu__menu > nav > ul > li.diviwp-menu-button { padding-left:0px; الحشو الأيمن:0px; اللون: #fff! مهم؛ /* يبدو أن Visual Builder يتجاوز هذا عند التحرير ولكنه يعمل على الواجهة الأمامية */ } /* اضبط هذه الخصائص لتتناسب مع الأنماط المفضلة لديك. راجع أنماط الجهاز اللوحي لنقطة توقف الجهاز اللوحي */ .et-db #et-boc .et-l .diviwp-header-2 .et_pb_menu–with-logo .et_pb_menu__menu > nav > ul > li.diviwp-menu-button > a { نصف قطر الحدود: 4 بكسل؛ لون الخلفية: #5cb85c؛ اللون: #ffffff! مهم؛ /* يبدو أن Visual Builder يتجاوز هذا عند التحرير ولكنه يعمل على الواجهة الأمامية */font-weight:old; الحشو: 10 بكسل 20 بكسل؛ } /* اضبط هذه الخصائص لتتناسب مع الأنماط المفضلة لديك */ .et-db #et-boc .et-l .diviwp-header-2 .et_pb_menu–with-logo .et_pb_menu__menu > nav > ul > li.diviwp-menu -زر > أ: تحوم { لون الخلفية: #47a447؛ اللون: #fff! مهم؛ /* يبدو أن Visual Builder يتجاوز هذا عند التحرير ولكنه يعمل على الواجهة الأمامية */ } /***** زر قائمة DIVIWP END *****/ /****** أيقونات عربة التسوق والبحث ** ***/ .et-db #et-boc .et-l .diviwp-header-2 .et_pb_menu .et_pb_menu__wrap { /* يؤدي هذا إلى محاذاة القائمة مع أيقونات عربة التسوق والبحث */ -ms-flex-wrap: nowrap; التفاف المرن: Nowrap؛ } /***** عربة التسوق النهائية وأيقونات البحث *****/ /****** أنماط القوائم الفرعية *****/ /* حاوية القائمة المنسدلة للقائمة الفرعية */ .et-db #et- boc .et-l .diviwp-header-2 ul.sub-menu { /* أعلى اليسار، أعلى اليمين، أسفل اليمين، أسفل اليسار */ border-radius: 4px 4px 4px 4px; } /* الرسوم المتحركة للقائمة المنسدلة عند التمرير */ .et-db #et-boc .et-l .diviwp-header-2 ul.sub-menu { -webkit-transition: جميع ملفات .07 سهلة الدخول! مهم؛ الانتقال: كل سهولة الدخول والخروج في .07! مهم؛ -تحويل webkit: مقياس (0.80)؛ -ms-transform: مقياس (0.80)؛ تحويل: مقياس (0.80)؛ } .et-db #et-boc .et-l .diviwp-header-2 .et_pb_menu .nav li:hover > ul { -webkit-transform:scale(1); -ms-transform: مقياس (1)؛ تحويل: مقياس (1)؛ } /* مثلث القائمة الفرعية أعلى القائمة المنسدلة للقائمة الفرعية. لتغيير لون المثلث، انتقل إلى إعدادات وحدة القائمة -> التصميم -> القائمة المنسدلة -> لون خط القائمة المنسدلة أو أضف خاصية اللون */ .et-db #et-boc .et-l .diviwp- header-2 .nav li ul.sub-menu:before { الموضع: مطلق؛ أعلى: -8px؛ اليسار: 16%؛ الهامش الأيسر: -8 بكسل؛ محتوى: ” “؛ الحدود اليمنى: 8 بكسل شفاف خالص؛ الحد السفلي: 8 بكسل صلب؛ لون الحدود السفلية: وراثة؛ الحد الأيسر: 8 بكسل شفاف خالص؛ } /* لا تعرض المثلث العلوي في القائمة المنسدلة للقائمة الفرعية للمستوى الثاني */ .et-db #et-boc .et-l .diviwp-header-2 .nav li ul.sub-menu li ul.sub -القائمة: قبل { العرض: لا شيء؛ } /* تقليل المساحة المتروكة أعلى وأسفل حاوية القائمة الفرعية */ .et-db #et-boc .et-l .diviwp-header-2 .et-menu-nav > ul ul { padding: 0px; } /* إزالة لون السطر العلوي */ .et-db #et-boc .et-l .diviwp-header-2 .et_pb_menu .nav li ul { /* border-top: 0px; ظل الصندوق: 0px 0px 5px 1px rgba(0,0,0,.1); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,.1); -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,.1); */ } /* القائمة الفرعية للمستوى الثاني */ .et-db #et-boc .et-l .diviwp-header-2 .nav li ul.sub-menu li ul.sub-menu { /* إزالة الحدود أعلى */ Border-top: 0px; /* إذا كان الحد العلوي هو 0 بكسل وتم ضبط المساحة المتروكة على 0 بكسل لحاوية القائمة الفرعية، فسنحتاج إلى ضبط هامش القائمة الفرعية بمقدار 23 بكسل لجعله يتماشى مع عنصر القائمة الرئيسية */ Margin-top: 23px; /* اضبط ظل الصندوق بحيث لا تتداخل القائمة الفرعية مع القائمة الفرعية الأصلية */ box-shadow: 3px 0px 5px 0px rgba(0,0,0,.1); -moz-box-shadow: 3px 0px 5px 0px rgba(0,0,0,.1); -webkit-box-shadow: 3px 0px 5px 0px rgba(0,0,0,.1); /*احتفظ بالقيمة العلوية اليسرى 0 لجعلها تبدو مرفقة بالقائمة الفرعية الرئيسية */ border-radius: 0px 4px 4px 4px; } /* الحد السفلي بين عناصر قائمة القائمة الفرعية */ .et-db #et-boc .et-l .diviwp-header-2 li ul.sub-menu li { /* ضبط لون الحدود هنا */ border -القاع: 1 بكسل صلب #ececec؛ الحشو الأيسر: 0px؛ الحشو الأيمن: 0px؛ العرض: 100%؛ } /* لا تعرض الحد السفلي لعنصر القائمة الأخير */ .et-db #et-boc .et-l .diviwp-header-2 li ul.sub-menu li:last-child { border- أسفل: لا شيء؛ } /* زيادة المساحة المتروكة وعرض روابط القائمة الفرعية */ .et-db #et-boc .et-l .diviwp-header-2 ul.sub-menu a { padding: 12px 20px; العرض: 100%؛ /* وزن الخط:700;*/ } /* إزالة لون خلفية رابط القائمة الفرعية عند التمرير */ .et-db #et-boc .et-l .diviwp-header-2 ul.sub-menu a:hover { /* يمكنك ضبط هذا اللون ليناسب أسلوبك */ لون الخلفية: #fff; العتامة: 1؛ -انتقال مجموعة الويب: لا شيء؛ -moz-transition: لا شيء؛ -o-الانتقال: لا شيء؛ الانتقال: لا شيء؛ } /* قم بتعيين نصف قطر الحدود عند تمرير العنصر الأول للحفاظ على نصف قطر الحدود المخصص للقائمة الفرعية */ .et-db #et-boc .et-l .diviwp-header-2 ul.sub-menu li:first-child a:hover { /*أعلى اليسار، أعلى اليمين، أسفل اليمين، أسفل اليسار */ border-radius: 0px 4px 4px 4px; } /* قم بتعيين نصف قطر الحدود عند العنصر الأخير الذي تم تمريره للحفاظ على نصف قطر الحدود المخصص للقائمة الفرعية */ .et-db #et-boc .et-l .diviwp-header-2 ul.sub-menu li:last- الطفل a:hover { /*أعلى اليسار، أعلى اليمين، أسفل اليمين، أسفل اليسار */ border-radius: 0px 0px 4px 4px; } /* قم بتغيير رمز علامة الإقحام التي تشير إلى الأسفل إلى الإشارة إلى اليمين إذا كان لدينا 3 عناصر قائمة مستوى */ .et-db #et-boc .et-l .diviwp-header-2 ul li ul li.menu-item-has- الأطفال > أ:الطفل الأول:بعد { المحتوى: “5”؛ أعلى: 12 بكسل؛ } /****** نهاية أنماط القوائم الفرعية *****/ /****** أنماط القائمة الضخمة ******/ /* مثلث القائمة الفرعية أعلى القائمة المنسدلة الفرعية. لتغيير لون المثلث، انتقل إلى إعدادات وحدة القائمة -> التصميم -> القائمة المنسدلة -> لون خط القائمة المنسدلة أو أضف خاصية اللون */ .et-db #et-boc .et-l .diviwp- header-2 nav ul li.mega-menu ul.sub-menu:before { الموضع: مطلق؛ اليسار: 50%؛ /* يؤدي هذا إلى وضع المثلث في وسط القائمة الفرعية. يمكنك ضبط هذا ليناسب احتياجاتك */ Margin-left: -20px; أعلى: -8px؛ العرض: 0; الارتفاع: 0; محتوى: ” “؛ الحدود اليمنى: 8 بكسل شفاف خالص؛ الحد السفلي: 8 بكسل صلب؛ لون الحدود السفلية: وراثة؛ الحد الأيسر: 8 بكسل شفاف خالص؛ } .et-db #et-boc .et-l .diviwp-header-2 .et_pb_menu .nav li.mega-menu > ul { الحشو: 2%; } .et-db #et-boc .et-l .diviwp-header-2 li.mega-menu ul.sub-menu li { width: auto; الحد السفلي: لا شيء؛ /* قم بإزالة هذا إذا كنت تريد الاحتفاظ بالحدود السفلية لعنصر القائمة */ } .et-db #et-boc .et-l .diviwp-header-2 .nav li.mega-menu ul.sub-menu li ul. القائمة الفرعية { الهامش العلوي: 0px؛ } .et-db #et-boc .et-l .diviwp-header-2 .et-menu-nav li.mega-menu.mega-menu-parent-3 > ul > li { border-bottom: none !important ; } /* عنوان الأعمدة – قم بتغيير هذا ليناسب احتياجاتك */ .et-db #et-boc .et-l .diviwp-header-2 .et-menu-nav li.mega-menu > ul > li > a :first-child { الحشو العلوي: 16 بكسل! مهم؛ حجم الخط: 14 بكسل؛ وزن الخط: 700؛ تحويل النص: أحرف كبيرة؛ تباعد الحروف: 0.05em؛ الحد السفلي: لا شيء! مهم؛ } /* قوائم الأعمدة الفرعية من المستوى الثاني */ .et-db #et-boc .et-l .diviwp-header-2 .et_pb_menu .nav li.mega-menu ul li ul { border-top: none !important ; } .et-db #et-boc .et-l .diviwp-header-2 ul li.mega-menu ul li ul.sub-menu:before {display: none; } /* الرسوم المتحركة */ .et-db #et-boc .et-l .diviwp-header-2 ul.sub-menu li ul.sub-menu { -webkit-transform:scale(1); -ms-transform: مقياس (1)؛ تحويل: مقياس (1)؛ } /****** أنماط القائمة النهائية الضخمة ******/ /****** استعلامات الوسائط المستجيبة *****/ /*** الأنماط المستجيبة لسطح المكتب الكبير وما فوق ***/ @media all و (العرض الأدنى: 1405 بكسل) { } /*** أنماط الاستجابة القياسية لسطح المكتب فقط ***/ @media all و (العرض الأدنى: 1100 بكسل) و (الحد الأقصى للعرض: 1405 بكسل) { } /*** الأنماط المستجيبة الكمبيوتر اللوحي وتحت ***/ @media all and (max-width: 980px) { /****** الحاويات اللازمة للتثبيت أو التثبيت *****/ .et-db #et-boc .et-l . diviwp-header-2 .et_pb_menu__menu { العرض: لا شيء؛ } .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_nav_menu { العرض: كتلة؛ } /***** نهاية الحاويات ******/ /****** همبرغر *****/ /* استبدل الهمبرغر بـ x عند فتح قائمة الهاتف المحمول */ .et-db #et-boc . et-l .diviwp-header-2 .mobile_nav.opened .mobile_menu_bar:before { content: “\4d”; } /***** نهاية أنماط هامبرغر *****/ /****** أنماط القائمة الفرعية *****/ /* حاوية القائمة المنسدلة للقائمة الفرعية */ .et-db #et-boc .et -l .diviwp-header-2 ul.et_mobile_menu { /* أعلى اليسار، أعلى اليمين، أسفل اليمين، أسفل اليسار */ border-radius: 4px 4px 4px 4px; ظل الصندوق: 1px 4px 20px 1px rgba(0,0,0,.1); الحشو: 0 بكسل؛ } /* إخفاء المثلث على الأجهزة اللوحية والهواتف المحمولة */ .et-db #et-boc .et-l .diviwp-header-2 ul li.mega-menu ul.sub-menu:before { Display: none; } /* إزالة الخط بين عناصر القائمة المنسدلة للقائمة الفرعية */ .et-db #et-boc .et-l .diviwp-header-2 li ul.sub-menu li { border-bottom: none !important; } .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu .menu-item-has-children > a { لون الخلفية: شفاف؛ الموقف: نسبي؛ وزن الخط: عادي؛ } .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu .menu-item-has-children > a:hover { لون الخلفية: rgba(0,0,0,.03); الموقف: نسبي؛ } /* تحويم روابط المستوى الثالث */ .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu li ul li a:hover { لون الخلفية: rgba(0,0,0,.03) ); } .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu li ul.sub-menu { العرض: لا شيء ! مهم؛ تحويل: لا شيء! مهم؛ المساحة المتروكة لليسار: 5%؛ } /***** نهاية أنماط القائمة الفرعية *****/ /****** قائمة أزرار DIVIWP *****/ /* انقل عنصر القائمة مع فئة الزر لأسفل */ .et-db #et- boc .et-l .diviwp-header-2 .et_mobile_menu li.diviwp-menu-button { هامش: 2%؛ } /* اضبط هذه الخصائص لتتناسب مع الأنماط المفضلة لديك. راجع أنماط الجهاز اللوحي لنقطة توقف الجهاز اللوحي */ .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu li.diviwp-menu-button a { ​​border-radius: 4px; لون الخلفية: #5cb85c؛ اللون: #ffffff! مهم؛ /* يبدو أن Visual Builder يتجاوز هذا عند التحرير ولكنه يعمل على الواجهة الأمامية */font-weight:old; الحشو: 10 بكسل 20 بكسل؛ محاذاة النص: مركز؛ } /* اضبط هذه الخصائص لتتناسب مع الأنماط المفضلة لديك */ .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu li.diviwp-menu-button a:hover { الخلفية-لون: #47a447 ; -انتقال مجموعة الويب: جميع ملفات .2؛ -moz-transition: جميع ملفات .2s؛ -o-transition: جميع .2s؛ الانتقال: جميع .2s؛ اللون: #fff! مهم؛ /* يبدو أن Visual Builder يتجاوز هذا عند التحرير ولكنه يعمل على الواجهة الأمامية */ } /****** END DIVIWP BUTTON MENU *****/ /****** REVEAL 2ND LEVEL SUB- انقر على القائمة بالسهم لأسفل *****/ .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu .menu-item-has-children { الموضع: نسبي؛ } /* تبديل القائمة الفرعية للدائرة */ .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu .sub-menu-toggle { الموضع: مطلق؛ مؤشر z: 1؛ العرض: 72 بكسل؛ الارتفاع: 36 بكسل؛ ارتفاع الخط: 36 بكسل؛ أعلى: 6 بكسل؛ اليمين: 0%؛ الحشو على اليمين: 10 بكسل؛ المؤشر: المؤشر؛ محاذاة النص: يمين؛ } /* تبديل القائمة الفرعية المغلقة */ .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu .sub-menu-toggle:before { /* لتغيير لون الجزء السفلي /up علامة الإقحام، انتقل إلى إعدادات القائمة -> التصميم -> القائمة المنسدلة -> لون خط القائمة المنسدلة */ Font-family: “ETmodules” !important; وزن الخط: عادي؛ نمط الخط: عادي؛ متغير الخط: عادي؛ -webkit-font-تجانس: الحواف؛ -moz-osx-font-تجانس: تدرج الرمادي؛ ارتفاع الخط: 36 بكسل؛ حجم الخط: 24 بكسل؛ تحويل النص: لا شيء؛ تكلم: لا شيء؛ المحتوى: ‘\33’; /* يمكن نقلها إلى .sub-menu-toggle ولكن المساحة القابلة للنقر تصبح صغيرة جدًا */ border: 5px Solid #f9f6f6; لون الخلفية: #f9f6f6؛ نصف قطر الحدود: 50%؛ } /* تبديل القائمة الفرعية المفتوحة */ .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu .sub-menu-toggle.reveal-items:before { content: ‘\32’; } .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu li ul.sub-menu.reveal-items { العرض: كتلة ! مهم؛ } .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_menu .menu-item-has-children > .icon-switch:after{ content: ‘\4d’ !important; } /****** نهاية الكشف عن القائمة الفرعية للمستوى الثاني *****/ /****** الرسوم المتحركة لقائمة الهاتف المحمول عند فتحها أو إغلاقها ******/ /* التلاشي أثناء انتقال حاوية قائمة الهاتف المحمول * / .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_nav_menu .mobile_nav .et_mobile_menu { العرض: كتلة ! مهم؛ /* إعدادات خاصة بالجهاز اللوحي. راجع إعدادات الهاتف المحمول أدناه */ /* min-height: 90vh; */ الارتفاع: تلقائي! مهم؛ العرض: 100%؛ الهامش العلوي: 10 بكسل! مهم؛ /* الخصائص المحددة للجهاز اللوحي */ right: 0; /* الموضع: ثابت؛ */ فهرس ض: 9998؛ الفائض: التمرير؛ أعلى الحدود: لا شيء؛ العتامة: 0؛ الرؤية: مخفية؛ -تحويل webkit: مقياس (.9)؛ -ms-transform: مقياس (.9)؛ تحويل: مقياس (.9)؛ -webkit-transform-origin: أعلى اليمين؛ -ms-transform-origin: أعلى اليمين؛ أصل التحويل: أعلى اليمين؛ } /* التلاشي عند الفتح */ .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_nav_menu .mobile_nav.opened .et_mobile_menu { opacity: 1; الرؤية: مرئية؛ -تحويل webkit: مقياس (1)؛ -ms-transform: مقياس (1)؛ تحويل: مقياس (1)؛ -وظيفة توقيت انتقال webkit: cube-bezier(0,0,.2,1); -o-وظيفة توقيت الانتقال: cube-bezier(0,0,.2,1); وظيفة توقيت الانتقال: cube-bezier(0,0,.2,1); -مدة انتقال مجموعة الويب: 0.2 ثانية؛ -مدة الانتقال: 0.2 ثانية؛ مدة الانتقال: 0.2 ثانية؛ /* لانتقال أسرع استخدم 75 مللي ثانية */ } /* Fade out مغلق */ .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_nav_menu .mobile_nav. Closed .et_mobile_menu { الرؤية: مخفي؛ -تحويل webkit: مقياس (.9)؛ -ms-transform: مقياس (.9)؛ تحويل: مقياس (.9)؛ -وظيفة توقيت انتقال webkit: cube-bezier(.4,0,1,1); -o-وظيفة توقيت الانتقال: cube-bezier(.4,0,1,1); وظيفة توقيت الانتقال: cube-bezier(.4,0,1,1); -مدة انتقال مجموعة الويب: 0.2 ثانية؛ -مدة الانتقال: 0.2 ثانية؛ مدة الانتقال: 0.2 ثانية؛ /* لانتقال أسرع استخدم 75 مللي ثانية */ } .et-db #et-boc .et-l .diviwp-header-2 .et_pb_fullwidth_menu .et_mobile_menu, .et-db #et-boc .et-l .diviwp-header- 2 .et_pb_menu .et_mobile_menu { الأعلى: تلقائي! مهم؛ اليسار: تلقائي! مهم؛ } /* منع إغلاق القائمة الفرعية عند النقر على الروابط */ .et-db #et-boc .et-l .diviwp-header-2 a.noslide ul.et_mobile_menu { height: inherit!important; الهامش العلوي: 10 بكسل! مهم؛ } /****** إنهاء الرسوم المتحركة لقائمة الهاتف المحمول عند فتحها أو إغلاقها ******/ } /* إنهاء استعلام وسائط الجهاز اللوحي */ /*** الأجهزة اللوحية المستجيبة للأنماط فقط ***/ @media all و (min- العرض: 768 بكسل) و(الحد الأقصى للعرض: 980 بكسل) { } /*** الهواتف الذكية ذات الأنماط المستجيبة فقط ***/ @media all و (الحد الأقصى للعرض: 767 بكسل) { } /*** صورة شخصية للهواتف الذكية ذات الأنماط المستجيبة *** / @media all and (max-width: 479px) { .et-db #et-boc .et-l .diviwp-header-2 .et_mobile_nav_menu .mobile_nav .et_mobile_menu { /* إعدادات الهاتف المحمول المحددة. انظر إعدادات الجهاز اللوحي أعلاه */ min-height: auto; الارتفاع: تلقائي؛ الهامش العلوي: 10 بكسل؛ /* نهاية الخصائص المحددة للجوال */ } } /* إنهاء استعلام وسائط الجوال */ /****** نهاية استعلامات الوسائط المستجيبة *****/ ]]>