ב-CSS, אתה יכול להגדיר עיצוב שונה עבור קישורים יוצאים על ידי שימוש ב-:not() pseudo-class כדי לבחור קישורים שאינם מפנים לאתר הנוכחי. הנה דוגמה:
a:not([href^="https://www.example.com"]) {
/* styles for outbound links */
color: blue;
text-decoration: underline;
}
כלל זה בוחר בכל הרכיבים בעלי תכונת href שאינה מתחילה ב-https://www.example.com. במילים אחרות, הוא בוחר את כל הקישורים המפנים לאתרים אחרים.
לאחר מכן תוכל להחיל כל סגנון שתרצה על קישורים אלה, כגון צבע טקסט שונה או קו תחתון. הסגנונות בדוגמה למעלה הופכים קישורים יוצאים לכחולים ולקו תחתון.
שימו לב ששיטה זו פועלת רק עבור קישורים בעלי תכונת href. אם ברצונך לבחור קישורים בעלי תכונה target="_blank" (שפותחת את הקישור בלשונית או בחלון חדש), תוכל להשתמש במקום זאת בבורר [target="_blank"]. לדוגמה:
a[target="_blank"] {
/* styles for links that open in a new tab */
text-decoration: none;
font-weight: bold;
}
כלל זה בוחר את כל הרכיבים בעלי תכונת יעד מוגדרת ל-"_blank". בדוגמה למעלה, הסגנונות הופכים את הקישורים הללו למודגשים ומסירים את הקו התחתון.
