كيف يمكنني استبدال النص الموجود في لقطة الشاشة بأي أيقونة SVG أخرى (أي أيقونة) باستخدام CSS فقط؟
أقدر ذلك كثيرًا! 
ستحتاج أولاً إلى تحميل ملف SVG الخاص بك في قسم التحميلات. بالنسبة لاسم متغير SCSS، قم بشيء قصير وموجز.
ثم، أضف هذا الجزء إلى علامة التبويب Common:
th.posts.sortable.num.topic-list-data {
content: url($name-of-variable);
}
لاحظ أنه لا يجب عليك وضع علامات اقتباس داخل أقواس url.
4 إعجابات
أداة مساعدة لـ Don لاستخدام الأيقونات في CSS:
5 إعجابات
أنا آسف، لم أفهم. ماذا تقصد بـ $name-of-variable؟ أحاول إضافة رمز SVG بعد content:، ولكنه لا يعمل. 
إعجاب واحد (1)
أقدر ذلك كثيرًا يا @Canapin ، لكنني لا أتطلع إلى تثبيت المزيد من المكونات لتغيير كلمة “replies” برمز SVG. 
اسم المتغير هو الاسم الذي أدخلته عند تحميل ملف SVG.
ستحتاج إلى أن تكون مسؤولاً للقيام بذلك.
- انتقل إلى
/adminفي المنتدى. - في الشريط الجانبي، اختر المكونات (Components) ضمن قسم التخصيصات (Customizations) وأنشئ مكونًا جديدًا.
- قم بتحميل ملف SVG ضمن التحميلات (Uploads) في أسفل صفحة المكون.
- اختر اسمًا للمتغير (في نافذة تحميل الملف).
- استخدم الكود الموجود في مشاركتي:
- استبدل
name-of-variableبالاسم الذي اخترته في الخطوة 4. احتفظ بالرمز$قبل اسم المتغير. - لقد انتهيت!
3 إعجابات
شكراً جزيلاً، الأمر واضح جداً الآن.
سؤال سريع: إذا كان لدي مثلاً 10 أيقونات، هل أحتاج إلى تحميل الأيقونات واحدة تلو الأخرى؟
نعم، أعتقد ذلك.
إعجابَين (2)
@Radu في حال لم يعمل دليلي، يمكنك اتباع هذا الدليل، حيث أعتقد أنه يمكنك تحميل ملف واحد فقط لأيقونات متعددة:
3 إعجابات
كان هذا منشورًا رائعًا وساعدني في استبدال الأيقونات الافتراضية. شيء آخر إذا سمحت…
فيما يلي، كيف يمكنني وضع أيقونة FontAwesome داخل content؟
th.topic-list-data.posts.num > span {
visibility: hidden;
}
th.topic-list-data.posts.num > span:after {
content:'a FontAwesome Icon here';
visibility: visible;
display: inline-block;
padding-bottom: 1.2em;
}
يمكنك تنزيله بصيغة SVG ثم القيام بنفس الشيء. وإلا، سيتعين عليك إنشاء مكون، وهو ما سيكون أكثر تعقيدًا.
إعجاب واحد (1)
إذًا، لا توجد طريقة للقيام بشيء كهذا؟
content:'fa d-icon d-icon-reply';
إذا لم يكن الأمر كذلك، فكيف سيبدو الكود لهذه الطريقة؟ أنا فقط بحاجة إلى مثال لأبدأ منه، لأنني جربت CSS الأساسي ولم يكن هناك أي تأثير.
أقدر ذلك كثيرًا!
لا، ولكن يمكنك استخدام نفس الطريقة التي استخدمتها مع الطرق السابقة. قم بتحميله، ثم أضفه كملف SVG اتبعته باستخدام الدليل؛
لست متأكدًا تمامًا من أين تريد وضع الأيقونة. هل يمكنك إرسال لقطة شاشة؟
شكرًا.
لا يهم أين، أريد فقط وضع أيقونة FA داخل السطر content:'...'
أعتقد أنني سأستخدم FA كعائلة خطوط ورموز Unicode داخل طريقة content.
يمكنك القيام بذلك:
لست متأكدًا بنسبة 100٪ مما إذا كان هذا يعمل، ولكني متأكد تمامًا من أنه يعمل.
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.