ما هي أفضل طريقة لإنشاء زوايا مستديرة متوافقة مع المعايير القائمة على المعايير في دروبال؟

Question

أنا أعمل حاليًا على موضوع Drupal 6 ، أي مصمم هو صراحة طلب استخدام الكثير من الزوايا المستديرة.

يمكنني بالطبع إنشاء الزوايا المستديرة - تقليديًا - مع الصور. لكنني أعلم أنه يجب أن يكون هناك أيضًا طرق أفضل وأسهل لإنشاء زوايا مستديرة.

على النحو الأمثل ، أود أن أكتب CSS الخاصة بي كـ CSS3 المتوافقة مع المعايير ، مع محددات مثل:

h2 {border-radius: 8px;}

استخدام المتصفح الخاص هو CSS على ما يرام أيضا ، مثل

h2 {-moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;}

إذا لزم الأمر ، يمكنني أيضًا إدراج بعض JavaScript المخصص باليد. أريد فقط أن أتجنب إضافة 100 صورة زاوية مدورة أخرى إلى علامات بلدي.

أي اقتراحات بشأن أفضل نهج؟

Answer 1

حدد فصلًا مثل "Roundy-Corner" واستخدم المكون الإضافي JQuery Corner مثل SO:

$('.roundy-corner').corner();

ستحتاج إلى المكون الإضافي jQuery Roundy Corner:

http://www.malsup.com/jquery/corner/

أحب استخدام JavaScript هنا لأنه لا يتطلب أي علامة إضافية في المستند المصدر ؛ سيقوم البرنامج النصي بإدراج عناصر العناصر النائبة حسب الحاجة. أيضًا ، في المستقبل البعيد ، عندما يكون لدينا جميعًا سيارات طيران ويدعم أي الحدود ، يمكنك استبدالها بـ CSS النقي.

Answer 2

بعض الملاحظات الخاصة بـ Drupal لاستخدام المكون الإضافي المقترح Corners المقترح:

1. تحميل jquery.corner.js ووضعه في مجلد البرامج النصية للتثبيت Drupal. تأكد من تعيين أذونات الملف بشكل صحيح.
2. قم بتحميل البرنامج النصي في موضوع (ZEN) عن طريق إضافة السطر التالي إلى template.php: drupal_add_js('scripts/jquery.corner.js');
3. قم بتعيين زوايا مستديرة إلى أي جزء من الصفحة عن طريق إضافة أوامر التصميم مرة أخرى إلى template.php. لاحظ أنك تحتاج إلى توصيلها باستخدام طريقة DRUPAL_ADD_JS. على سبيل المثال:

drupal_add_js(
  "$(document).ready(function() {
       $('#primary a').corner('top round 4px');
       $('.block-inner h2.title').corner('top round 4px');
   });",
  'inline'
);

هذا هو!!! زوايا مستديرة جميلة بدون صور!