קבוצות כפתורים

השתמש בקבוצות לחצנים כדי לחבר מספר כפתורים יחד כרכיב מורכב אחד. בנה אותם עם סדרה של <a>או <button>אלמנטים.

שיטות עבודה מומלצות

אנו ממליצים על ההנחיות הבאות לשימוש בקבוצות לחצנים וסרגלי כלים:

• השתמש תמיד באותו אלמנט בקבוצת לחצנים בודדים, <a>או <button>.
• אל תערבב כפתורים בצבעים שונים באותה קבוצת כפתורים.
• השתמש בסמלים בנוסף לטקסט או במקום, אך הקפד לכלול טקסט חלופי וכותרת במידת הצורך.

קבוצות לחצנים קשורות עם תפריטים נפתחים (ראה להלן) צריכות להיקרא בנפרד ולכלול תמיד סימן נפתח כדי לציין את ההתנהגות המיועדת.

דוגמה כברירת מחדל

כך נראה ה-HTML עבור קבוצת לחצנים סטנדרטית הבנויה עם לחצני תג עוגן:

<div class = "btn-group" > 
  <a class = "btn" href = "#"> 1 </a> _  
  <a class = "btn" href = "#"> 2 </a> _  
  <a class = "btn" href = "#"> 3 </a> _  
</div>

דוגמה לסרגל הכלים

שלב סטים של <div class="btn-group">לרכיבים <div class="btn-toolbar">מורכבים יותר.

<div class = "btn-toolbar" > 
  <div class = "btn-group" > 
    ...
  </div>
</div>

טעמי צ'קבוק ורדיו

קבוצות לחצנים יכולות לתפקד גם כמכשירי קשר, שבהם רק כפתור אחד עשוי להיות פעיל, או תיבות סימון, שבהן כל מספר של לחצנים עשוי להיות פעיל. הצג את מסמכי Javascript בשביל זה.

קבל את ה-Javascript »

שימו לב

CSS עבור קבוצות כפתורים נמצא בקובץ נפרד, button-groups.less.

כפתורים נפתחים

השתמש בכל כפתור כדי להפעיל תפריט נפתח על ידי הצבתו בתוך a .btn-groupומתן סימון התפריט המתאים.

שימו לב! תפריטי כפתור נפתחים דורשים את התוסף הנפתח Bootstrap כדי לתפקד.

סימון דוגמה

בדומה לקבוצת כפתורים, הסימון שלנו משתמש בסימון כפתורים רגיל, אך עם קומץ תוספות כדי לחדד את הסגנון ולתמוך בתוסף jQuery הנפתח של Bootstrap.

<div class = "btn-group" > 
  <a class = "btn dropdown-toggle" data-toggle = "dropdown" href = "#" >   
    פעולה
    <span class = "caret" ></span> 
  </a>
  <ul class = "תפריט נפתח" > 
    <!-- קישורי תפריט נפתח -->
  </ul>
</div>

תפריטים נפתחים של כפתור פיצול

בהתבסס על סגנונות קבוצת הכפתורים והסימון, נוכל ליצור בקלות כפתור מפוצל. לחצני פיצול כוללים פעולה רגילה בצד שמאל ותפריט נפתח בצד ימין עם קישורים הקשריים.

סימון דוגמה

אנו מרחיבים את תפריטי הלחצנים הרגילים כדי לספק פעולת כפתור שנייה הפועלת כטריגר נפרד.

<div class = "btn-group" > 
  <a class = "btn" href = "#" > פעולה </a>  
  <a class = "btn dropdown-toggle" data-toggle = "dropdown" href = "#" >   
    <span class = "caret" ></span> 
  </a>
  <ul class = "תפריט נפתח" > 
    <!-- קישורי תפריט נפתח -->
  </ul>
</div>

מעמד בסיס רב עוצמה

כל רכיבי הניווט כאן - כרטיסיות, כדורים ורשימות - חולקים את אותו סימון וסגנונות בסיס דרך .navהכיתה.

מתי להשתמש

כרטיסיות וכדורים מצוינים עבור קטעי תוכן או ניווט בין דפים של תוכן קשור.

יישור רכיבים

כדי ליישר קישורי ניווט, השתמש במחלקות השירות .pull-leftאו . .pull-rightשתי המחלקות יוסיפו ציף CSS בכיוון שצוין.

כרטיסיות בסיסיות

קח <ul>קישורים קבועים והוסף .nav-tabs:

• בית
• פּרוֹפִיל
• הודעות

<ul class = "nav nav-tabs" > 
  <li class = "פעיל" > 
    <a href = "#" > דף הבית </a> 
  </li>
  <li><a href = "#" > ... </a></li> 
  <li><a href = "#" > ... </a></li> 
</ul>

כדורים בסיסיים

קח את אותו HTML, אבל השתמש .nav-pillsבמקום זאת:

• בית
• פּרוֹפִיל
• הודעות

<ul class = "nav nav-pills" > 
  <li class = "פעיל" > 
    <a href = "#" > דף הבית </a> 
  </li>
  <li><a href = "#" > ... </a></li> 
  <li><a href = "#" > ... </a></li> 
</ul>

איך עורמים אותם

מכיוון שהכרטיסיות והכדורים הם אופקיים כברירת מחדל, פשוט הוסף מחלקה שנייה, .nav-stacked, כדי לגרום להם להיראות מוערמים אנכית.

כרטיסיות מוערמות

• בית
• פּרוֹפִיל
• הודעות

<ul class = "nav nav-tabs nav-stacked" > 
  ...
</ul>

כדורים מוערמים

• בית
• פּרוֹפִיל
• הודעות

<ul class = "nav nav-pills nav-stacked" > 
  ...
</ul>

תפריטים עשירים קלים

תפריטים נפתחים בלשוניות ובגלולות Bootstrap הם קלים במיוחד ודורשים רק מעט HTML נוסף ותוסף jQuery קל משקל.

עברו לדף Javascript כדי לקרוא את המסמכים על אתחול תפריטים נפתחים ב-Bootstrap.

כרטיסיות עם תפריטים נפתחים

• בית
• פּרוֹפִיל
• להפיל
  • פעולה
  • פעולה נוספת
  • משהו אחר כאן
  • קישור מופרד

<ul class = "nav nav-tabs" > 
  <li class = "dropdown" > 
    <a class = "dropdown-toggle" 
       data-toggle = "תפריט נפתח"
       href = "#" >
        להפיל
        <b class = "caret" ></b> 
      </a>
    <ul class = "תפריט נפתח" > 
      <!-- קישורים -->
    </ul>
  </li>
</ul>

גלולות עם תפריט נפתח

• בית
• פּרוֹפִיל
• להפיל
  • פעולה
  • פעולה נוספת
  • משהו אחר כאן
  • קישור מופרד

<ul class = "nav nav-pills" > 
  <li class = "dropdown" > 
    <a class = "dropdown-toggle" 
       data-toggle = "תפריט נפתח"
       href = "#" >
        להפיל
        <b class = "caret" ></b> 
      </a>
    <ul class = "תפריט נפתח" > 
      <!-- קישורים -->
    </ul>
  </li>
</ul>

ניווט בסגנון אפליקציה

רשימות ניווט מספקות דרך פשוטה וקלה לבנות קבוצות של קישורי ניווט עם כותרות אופציונליות. הם משמשים בצורה הטובה ביותר בסרגלי צד כמו Finder ב-OS X.

מבחינה מבנית, הם בנויים על אותם סגנונות ניווט מרכזיים כמו כרטיסיות וכדורים, כך שהשימוש וההתאמה האישית הם פשוטים.

עם אייקונים

קל לצייד רשימות ניווט גם בסמלים. הוסף את התג המתאים <i>עם הכיתה ואתה מוכן.

רשימת ניווט לדוגמה

קח רשימה של קישורים והוסף class="nav nav-list":

<ul class = "nav nav-list" > 
  <li class = "nav-header" > 
    כותרת רשימה
  </li>
  <li class = "פעיל" > 
    <a href = "#" > דף הבית </a> 
  </li>
  <li>
    <a href = "#" > ספרייה </a> 
  </li>
  ...
</ul>

דוגמה עם אייקונים

אותה דוגמה, אבל עם <i>תגיות לסמלים.

<ul class = "nav nav-list" > 
  ...
  <li>
    <a href = "#" > 
      <i class = "icon-book" ></i> 
      סִפְרִיָה
    </a>
  </li>
  ...
</ul>

מה נכלל

תחייה את הכרטיסיות שלך עם תוסף פשוט למעבר בין תוכן דרך כרטיסיות. Bootstrap משלב כרטיסיות הניתנות לכרטיסיות בארבעה סגנונות: למעלה (ברירת מחדל), ימין, תחתון ושמאלי.

השינוי ביניהם קל ודורש רק שינוי מועט מאוד של סימון.

דוגמה לטאבים

כדי להפוך את הכרטיסיות לכרטיסיות, עטוף את ה- .nav-tabsdiv ב-div אחר עם הכיתה .tabbable.

תוסף jQuery מותאם אישית

כל הכרטיסיות הניתנות לכרטיסיות מופעלות על ידי תוסף jQuery קל המשקל שלנו. קרא עוד על איך להחיות את הכרטיסיות הניתנות לכרטיסיות בדף המסמכים של javascript.

קבל את ה-Javascript →

לשוניות בתחתית

הפוך את סדר ה-HTML והוסף מחלקה כדי לשים כרטיסיות בתחתית.

<div class = "tabable tabs-below" > 
  <div class = "tab-content" > 
    ...
  </div>
  <ul class = "nav nav-tabs" > 
    ...
  </ul>
</div>

כרטיסיות בצד שמאל

החלף את הכיתה כדי לשים כרטיסיות בצד שמאל.

<div class = "tabable tabs-left" > 
  <ul class = "nav nav-tabs" > 
    ...
  </ul>
  <div class = "tab-content" > 
    ...
  </div>
</div>

כרטיסיות בצד ימין

החלף את הכיתה כדי לשים כרטיסיות בצד ימין.

<div class = "tabable tabs-right" > 
  <ul class = "nav nav-tabs" > 
    ...
  </ul>
  <div class = "tab-content" > 
    ...
  </div>
</div>

פיגומי Navbar

ה-navbar דורש רק כמה divs כדי לבנות אותו היטב עבור תצוגה סטטית או קבועה.

<div class = "navbar" > 
  <div class = "navbar-inner" > 
    <div class = "container" > 
      ...
    </div>
  </div>
</div>

סרגל ניווט קבוע

כדי להפוך את סרגל הניווט למקובע לחלק העליון של נקודת התצוגה, הוסף .navbar-fixed-topלחלק החיצוני ביותר, .navbar.

<div class = "navbar navbar-fixed-top" > 
  ...
</div>

ב-CSS שלך, תצטרך לקחת בחשבון גם את החפיפה שהוא גורם על ידי הוספת ריפוד של 40px או יותר ל- <body>. הקפד להוסיף את זה אחרי הליבה Bootstrap CSS ולפני CSS הרספונסיבי האופציונלי.

שם מותג

קישור פשוט להצגת שם המותג או הפרויקט שלך דורש רק תג עוגן.

<a class = "brand" href = "#" >  
  שם הפרוייקט
</a>

טופס חיפוש

טפסי חיפוש מקבלים סגנונות מותאמים אישית בסרגל הניווט עם .navbar-searchהכיתה. כלול .pull-leftאו .pull-rightעל formכדי ליישר אותו.

<form class = "navbar-search pull-left" > 
  <input type = "text" class = "search-query" מציין מיקום = "חיפוש" >   
</form>

וריאציה תגובה אופציונלית

בהתאם לכמות התוכן בסרגל העליון שלך, ייתכן שתרצה ליישם את האפשרויות הרספונסיביות. כדי לעשות זאת, עטוף את תוכן הניווט שלך ב-div המכיל, .nav-collapse.collapseוהוסף את לחצן החלפת סרגל הניווט, .btn-navbar.

<div class = "navbar" > 
  <div class = "navbar-inner" > 
    <div class = "container" > 
 
      <!-- .btn-navbar משמש כבורר עבור תוכן סרגל ניווט מכווץ -->
      <a class = "btn btn-navbar" data-toggle = "collapse" data-target = ".nav-collapse" >   
        <span class = "icon-bar" ></span> 
        <span class = "icon-bar" ></span> 
        <span class = "icon-bar" ></span> 
      </a>
 
      <!-- הקפד להשאיר את המותג בחוץ אם אתה רוצה שהוא יוצג -->
      <a class = "brand" href = "#" > שם הפרויקט </a>  
 
      <!-- כל מה שאתה רוצה מוסתר ב-940px או פחות, מקם בפנים -->
      <div class = "nav-collapse" > 
        <!-- .nav, .navbar-search, .navbar-form וכו' -->
      </div>
 
    </div>
  </div>
</div>

קישורי ניווט

פריטי Nav קל להוסיף באמצעות רשימות לא מסודרות.

<ul class = "nav" > 
  <li class = "פעיל" > 
    <a href = "#" > דף הבית </a> 
  </li>
  <li><a href = "#" > קישור </a></li> 
  <li><a href = "#" > קישור </a></li> 
</ul>

אתה יכול בקלות להוסיף חוצצים לקישורי הניווט שלך עם פריט רשימה ריק ומחלקה פשוטה. פשוט הוסף את זה בין קישורים:

<ul class = "nav" > 
  ...
  <li class = "מחלק-אנכי" ></li> 
  ...
</ul>

יישור רכיבים

כדי ליישר ניווט, טופס חיפוש או טקסט, השתמש במחלקות השירות .pull-leftאו . .pull-rightשתי המחלקות יוסיפו ציף CSS בכיוון שצוין.

הוספת תפריטים נפתחים

הוספת תפריטים נפתחים ל-nav היא סופר פשוטה, אך דורשת שימוש בתוסף ה-javascript שלנו .

<ul class = "nav" > 
  <li class = "dropdown" > 
    <a href = "#" 
          class = "החלפת תפריט נפתח"
          data-toggle = "תפריט נפתח" >
          חֶשְׁבּוֹן
          <b class = "caret" ></b> 
    </a>
    <ul class = "תפריט נפתח" > 
      ...
    </ul>
  </li>
</ul>

קבל את ה-Javascript →

למה להשתמש בהם

ניווט בפירורי לחם משמש כדרך להראות למשתמשים היכן הם נמצאים בתוך אפליקציה או אתר, אך לא עבור ניווט ראשי. שמור על שימוש דליל ותמציתי כדי להיות היעיל ביותר.

דוגמאות

דוגמה בודדת מוצגת כפי שהיא עשויה להיות מוצגת על פני מספר דפים.

• בית

• דף הבית /
• סִפְרִיָה

• דף הבית /
• ספריה /
• נתונים

סימון

HTML היא הרשימה הלא מסודרת הרגילה שלך עם קישורים.

<ul class = "פירורי לחם" > 
  <li>
    <a href = "#" > דף הבית </a> <span class = "divider" > / </span>   
  </li>
  <li>
    <a href = "#" > ספרייה </a> <span class = "divider" > / </span>   
  </li>
  <li class = "פעיל" > 
    <a href = "#" > נתונים </a> 
  </li>
</ul>

מתי להשתמש

עימוד פשטני במיוחד ובסגנון מינימלי בהשראת Rdio, נהדר עבור אפליקציות ותוצאות חיפוש. קשה לפספס את הבלוק הגדול, ניתן להרחבה בקלות ומספק אזורי קליקים גדולים.

קישורי עמוד ממלכתיים

הקישורים ניתנים להתאמה אישית ועובדים במספר נסיבות עם המעמד הנכון. .disabledעבור קישורים בלתי ניתנים ללחיצה ולעמוד .activeהנוכחי.

יישור גמיש

הוסף אחת משתי מחלקות אופציונליות כדי לשנות את היישור של קישורי עימוד: .pagination-centeredו .pagination-right.

דוגמאות

רכיב העימוד המוגדר כברירת מחדל הוא גמיש ועובד במספר וריאציות.

סימון

עטוף ב- <div>, עימוד הוא רק <ul>.

<div class = "Pagement" > 
  <ul>
    <li><a href = "#" > הקודם </a></li> 
    <li class = "פעיל" > 
      <a href = "#"> 1 </a> _ 
    </li>
    <li><a href = "#" > 2 </a></li> 
    <li><a href = "#" > 3 </a></li> 
    <li><a href = "#" > 4 ​​</a></li> 
    <li><a href = "#" > הבא </a></li> 
  </ul>
</div>

לגבי ביפר

רכיב הביפר הוא קבוצה של קישורים להטמעות פשוטות של עימוד עם סימון קל וסגנונות קלילים אף יותר. זה נהדר עבור אתרים פשוטים כמו בלוגים או מגזינים.

דוגמה כברירת מחדל

כברירת מחדל, הביפר מרכז קישורים.

• קודם
• הַבָּא

<ul class = "ביפר" > 
  <li>
    <a href = "#" > הקודם </a> 
  </li>
  <li>
    <a href = "#" > הבא </a> 
  </li>
</ul>

קישורים מיושרים

לחלופין, תוכל ליישר כל קישור לצדדים:

• ← ישן יותר
• חדש יותר →

<ul class = "ביפר" > 
  <li class = "הקודם" > 
    <a href = "#" > ← ישן יותר </a> 
  </li>
  <li class = "הבא" > 
    <a href = "#" > חדש יותר → </a> 
  </li>
</ul>

Bootstrap מספק רכיב קל משקל וגמיש הנקרא יחידת גיבור כדי להציג תוכן באתר שלך. זה עובד היטב באתרים עתירי תוכן.

סימון

עטפו את התוכן שלכם ב- divlike so:

<div class = "hero-unit" > 
  <h1> כותרת </h1>
  <p> קו תג </p>
  <p>
    <a class = "btn btn-primary btn-large" > 
      למד עוד
    </a>
  </p>
</div>

מעטפת פשוטה h1לרווח ולפלח כראוי קטעי תוכן בדף. זה יכול להשתמש ברכיב h1ברירת המחדל של small, כמו גם ברוב הרכיבים האחרים (עם סגנונות נוספים).

<div class = "page-haeder" > 
  <h1> כותרת דף לדוגמה </h1>
</div>

ברירת מחדל של תמונות ממוזערות

כברירת מחדל, התמונות הממוזערות של Bootstrap נועדו להציג תמונות מקושרות עם סימון מינימלי נדרש.

ניתן להתאמה אישית גבוהה

עם קצת סימון נוסף, אפשר להוסיף כל סוג של תוכן HTML כמו כותרות, פסקאות או כפתורים לתמונות ממוזערות.

• 

  תווית תמונה ממוזערת

  Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.

  פעולה פעולה

• 

  תווית תמונה ממוזערת

  Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.

  פעולה פעולה

למה להשתמש בתמונות ממוזערות

תמונות ממוזערות (בעבר .media-gridעד גרסה 1.4) מעולות עבור רשתות של תמונות או סרטונים, תוצאות חיפוש תמונות, מוצרים קמעונאיים, תיקי עבודות ועוד. הם יכולים להיות קישורים או תוכן סטטי.

סימון פשוט וגמיש

סימון תמונות ממוזערות הוא פשוט - ulעם כל מספר liאלמנטים הוא כל מה שנדרש. זה גם סופר גמיש, ומאפשר לכל סוג של תוכן עם קצת יותר סימון כדי לעטוף את התוכן שלך.

משתמש בגדלים של עמודות רשת

לבסוף, רכיב התמונות הממוזערות משתמש במחלקות מערכת רשת קיימות - כמו .span2או .span3- לשליטה בממדים של תמונות ממוזערות.

הסימון

כפי שהוזכר קודם לכן, הסימון הנדרש עבור תמונות ממוזערות הוא קל ופשוט. להלן מבט על הגדרת ברירת המחדל עבור תמונות מקושרות :

<ul class = "תמונות ממוזערות" > 
  <li class = "span3" > 
    <a href = "#" class = "תמונה ממוזערת" >  
      <img src = "https://placehold.it/260x180" alt = "" >  
    </a>
  </li>
  ...
</ul>

עבור תוכן HTML מותאם אישית בתמונות ממוזערות, הסימון משתנה מעט. כדי לאפשר תוכן ברמת חסימה בכל מקום, אנו מחליפים את ה <a>- לייק <div>כך:

<ul class = "תמונות ממוזערות" > 
  <li class = "span3" > 
    <div class = "thumbnail" > 
      <img src = "https://placehold.it/260x180" alt = "" >  
      <h5> תווית תמונה ממוזערת </h5>
      <p> כיתוב תמונה ממוזערת ממש כאן... </p>
    </div>
  </li>
  ...
</ul>

דוגמאות נוספות

חקור את כל האפשרויות שלך עם מחלקות הרשת השונות הזמינות לך. ניתן גם לערבב ולהתאים בגדלים שונים.

כיתה בסיס משוכתבת

עם Bootstrap 2, פישטנו את מחלקת הבסיס: .alertבמקום .alert-message. צמצמנו גם את הסימון המינימלי הנדרש - לא <p>נדרש כברירת מחדל, רק החיצוני <div>.

הודעת התראה בודדת

עבור רכיב עמיד יותר עם פחות קוד, הסרנו את המראה המבדיל עבור התראות חסימה, הודעות שמגיעות עם יותר ריפוד ובדרך כלל יותר טקסט. גם הכיתה השתנתה ל .alert-block.

הולך מצוין עם javascript

Bootstrap מגיע עם תוסף jQuery נהדר שתומך בהודעות התראה, מה שהופך את ביטולן למהיר וקלה.

קבל את התוסף »

התראות לדוגמה

עטוף את ההודעה שלך וסמל סגירה אופציונלי ב-div עם שיעור פשוט.

<div class = "alert" > 
  <a class = "close" data-dismiss = "alert" > × </a>  
  <strong> אזהרה! </strong> הכי טוב תבדוק את עצמך, אתה לא נראה טוב מדי.
</div>

הרחב בקלות את הודעת ההתראה הסטנדרטית עם שתי מחלקות אופציונליות: .alert-blockעבור יותר פקדי ריפוד וטקסט .alert-headingועבור כותרת תואמת.

<div class = "alert alert-block" > 
  <a class = "close" data-dismiss = "alert" > × </a>  
  <h4 class = "alert-heading" > אזהרה! </h4> 
  הכי טוב תבדוק את עצמך, אתה לא...
</div>

טעות או סכנה

<div class = "alert alert-error" > 
  ...
</div>

הַצלָחָה

<div class = "alert alert-success" > 
  ...
</div>

מֵידָע

<div class = "Alert alert-info" > 
  ...
</div>

בסיסי

סרגל התקדמות ברירת מחדל עם שיפוע אנכי.

<div class = "התקדמות" > 
  <div class = "בר" 
       style = " רוחב : 60 %; " ></div> 
</div>

מְפוּספָּס

משתמש בשיפוע כדי ליצור אפקט פסים.

<div class = "מידע על התקדמות 
     פסי התקדמות" >
  <div class = "בר" 
       style = " רוחב : 20 %; " ></div> 
</div>

אנימציה

לוקח את הדוגמה המפוספסת ומחייה אותה.

<div class = "התקדמות התקדמות-סכנה 
     התקדמות פס פעיל" >
  <div class = "בר" 
       style = " רוחב : 40 %; " ></div> 
</div>

צבעים נוספים

סרגלי התקדמות משתמשים בחלק מאותם שמות מחלקות כמו לחצנים והתראות עבור עיצוב דומה.

• .progress-info
• .progress-success
• .progress-danger

לחלופין, אתה יכול להתאים אישית את הקבצים הפחות ולגלגל את הצבעים והגדלים שלך.

התנהגות

סרגלי התקדמות משתמשים במעברי CSS3, כך שאם תתאים באופן דינמי את הרוחב באמצעות javascript, הוא ישנה את הגודל בצורה חלקה.

אם אתה משתמש .activeבכיתה, .progress-stripedפסי ההתקדמות שלך יפעילו את הפסים משמאל לימין.

תמיכה בדפדפן

פסי התקדמות משתמשים בהדרגות CSS3, מעברים והנפשות כדי להשיג את כל ההשפעות שלהם. תכונות אלה אינן נתמכות ב-IE7-8 או גרסאות ישנות יותר של Firefox.

אופרה אינה תומכת באנימציות בשלב זה.

וולס

השתמש בבאר כאפקט פשוט על אלמנט כדי לתת לו אפקט מוכנס.

<div class = "טוב" > 
  ...
</div>

תגים

השתמש בתג על אלמנט עבור ספירה שלא נקראה או כאינדיקטור פשוט.

<span class = "badge" > 3 </div> 

סמל סגירה

השתמש בסמל הסגירה הגנרי לביטול תוכן כמו שיטות והתראות.

×

<a class = "close" > × </a>