أود أن إنشاء horizonatal فاصل القائمة مع CSS فقط, بدون أي صورة. أنا استخدم هذا الأسلوب أساسا في رأس أو تذييل القوائم. ومع ذلك كان محدودا بهذه الطريقة, لأنني كنت أعرف فقط من الحدود اليسار أو اليمين خصائص CSS (ز. الحدود اليسار:1px الصلبة # CCC الحدود أو اليمين:1px الصلبة # CCC) وهذه الخصائص الأماكن فقط ” | ” separator in the menus. Not too creative.

لكن – tatatata  – I found one new (for me) CSS property “المحتوى” and one new (for me) class selector “li:بعد”, so I can place special characters in my menus as a menu separator now.

المثال:

li:after {content:" | "}

My site’s footer menu has been created by the following parameters:

#footermenu li:after {content:" > "}#footermenu li.item81:after {content:" "}

The first “المحتوى” property place a “>” character after all menu items in the footer menu, the second “المحتوى” property deletes the “>” character from last (item81) menu item.

I tested it in Firefox 3, IE 8, Google Chrome 2.0 and Opera 9.63, it works fine in all mentioned browser.

See my menu in the footer.