الصفحة الرئيسية>دروس تصميم الويب>توحيد الويب

لف الأحرف الطويلة مثل عناوين URL وعناوين البريد الإلكتروني

الكاتب：Eve Cole وقت التحديث：2009-05-31 01:04:55

جعل الأحرف الطويلة تلتف تلقائيًا (مثل عناوين URL وعناوين البريد الإلكتروني) الغرض: جعل السلاسل الطويلة جدًا تلتف تلقائيًا، ولكن لا تقسم الكلمات القصيرة في المنتصف.

وإليك الطريقة:

  1. <نمط>   
  2. شعبة {
  3. width:300px;overflow:hidden;/* بالنسبة إلى FF,Opera، عرض ثابت لإخفاء الأحرف الإضافية*/
  4. التفاف الكلمات:فاصل الكلمات;فاصل الكلمات:عادي;/* بالنسبة لـ IE وSafari، يدعم التفاف الأسطر تلقائيًا*/
  5. }
  6. </ الأسلوب >   

يمكنك تشغيل التعليمات البرمجية التالية في IE وFirefox وOpera وSafari على التوالي لترى:

  1. < الاسلوب   اكتب = "نص/CSS" >   
  2. div {العرض: 200px؛ الخلفية: أحمر؛ الفائض: مخفي؛ التفاف الكلمات: فاصل كلمة؛ فاصل الكلمات: عادي؛}
  3. </ الأسلوب >   
  4. < ديف > مبروك
  5. التفاف الأحرف الطويلة (مثل عناوين URL وعناوين البريد الإلكتروني):
  6. http://www.div-css.com/html/standard/base/81857.html
  7. SDFG تحتوي بعض الكلمات على مسافات...
  8. XXXXXXXXXXXXDGXXXXXXXXXYYYYDFGYYXXXXXXXXXSDGXXXXXXXXXXXXyXXXXXXXXXXXXxwhite-space: nowrap
  9. بعض الخطوط الصينية بعض الخطوط الصينية بعض الخطوط الصينية بعض الخطوط الصينية بعض الخطوط الصينية بعض الخطوط الصينية، قد لا تلتف
  10. توحيد الويب < أ   href = "http://www.div-css.com"   _fcksavedurl = "http://www.div-css.com" > www.div-css.com </ a >   
  11. الحروف الصينية الحروف الصينية الحروف الانجليزية الصينية الحروف الانجليزية الصينية الحروف الصينية الحروف الانجليزية الصينية الحروف الانجليزية الصينية الحروف الانجليزية الصينية الحروف الانجليزية الصينية الحروف الانجليزية الصينية الحروف الانجليزية الصينية الحروف الانجليزية الصينية
  12. </div>  

بالإضافة إلى ذلك، لا يُنصح باستخدام JS على الإنترنت لالتفاف السلاسل الطويلة تلقائيًا في Firefox، والسبب هو أن السلسلة التي تم الحصول عليها بعد الالتفاف لم تعد السلسلة الأصلية، على سبيل المثال، إذا كانت عبارة عن رابط العنوان، إذا قمت بنسخه مرة أخرى، فلن تحصل على العنوان الأصلي بعد الآن، وستكون هناك مسافة في المنتصف. وهذا بالفعل رابط آخر.
مقالات ذات صلة