Red dot ähnlich "li" - element in HTML

Habe ich HTML-code wie dieser:

<tr>    
  <td align="left" valign="bottom"  class="leftfooter"><a href="#">Customer Support</a> <a href="#" class="footerlink">About</a></td>
</tr>

Wie kann ich einen kleinen roten Punkt vor dem gesamten text? Eine Art, wie

  • aber rot und kleiner.

    Bearbeiten

    Nur um zu klären, habe ich nicht Schreibe diesen HTML. Ich habe gerade kopiert und eingefügt, es zu zeigen, was ich arbeite. Ich merke, dass ich sollte, verwenden Sie eine unsortierte to-do-Liste dieser gleichen Aufgabe statt einer Tabelle eine Struktur für diesen Zweck, für semantische Gründe. Wenn ich kann, werde ich sehen, ob ich ändern kann, dieses Stück des Codes, um eine besser geeignet, eine Kunden-Basis zu nutzen.

    • -1 ich sehe eine nicht-semantische-Verwendung von Tabellen.
    • Ich glaube nicht, dass sollte ein Kriterium für die downvoting eine Frage. Ich bin upvoting es...
    • ist dieses wirklich Wert -1 ??? Sie weiß nicht, warum er dies zu tun. Vielleicht arbeitet er an einem sharepoint-Projekt 🙂 Sie sollte nur downvote Fragen, wenn Sie schlecht gefragt werden oder wenn Sie keinen Sinn machen, aber diese tut es.
    • ich persönlich glaube nicht, dass 'Sympathie' sollte ein Kriterium sein für die Abstimmung eine Frage.
    • Ich bin eigentlich der Arbeit auf einem sharepoint-Projekt..Woher wissen Sie das?
    • Ich habe nicht upvote, weil ich zu zeigen versucht, Sympathie. Ich von Ihnen positiv bewertet werden, weil ich auch nicht weiß, wie man einen roten Punkt 🙂 .
    • Ich nehme mein downvote, wenn @Sev Bearbeitungen der Frage zu sagen, dass er nicht geschrieben hat die nicht-semantisches html und versteht, warum es eine schlechte Idee ist. Jeder Benutzer kann abstimmen, wie er oder Sie gefällt, und die ich lieber unten abstimmen schlechte Nutzung der Semantik. Wenn Menschen beweisen, dass Sie haben einen Anschein von Verständnis von dem, was nicht zu tun, die ich gerne entfernen meine downvotes.
    • Ich habe bearbeitet die Frage.
    • seine nicht schwer zu sagen, sharepoint generieren die schlimmsten FrontEnd Code, den ich je gesehen habe, voll von Tabellen und Scheiße. Aber es ist ein MS Produkt-es ist also eine überraschung für niemand.

    InformationsquelleAutor Sev | 2011-02-15
    1. 6

      Ich hatte nicht bemerkt, dass Sie wurden mit table Elemente, auf den ersten, so werde ich Vorwort meine vorhandenen Antwort mit der starke Anregung verwenden eine tatsächliche ul oder ol element. Das vermittelt eine gewisse form der Bedeutung der Inhalte darin. Bitte berücksichtigen, Bildschirm-Lesegeräte, oder Benutzer mit Geräten, die Zugriff auf die Daten nicht visuell.

      Ziemlich einfach:

      html:

      <ul>
    <li><span>Some text</span></li>
    <li><span>more stuff</span></li>
</ul>

      css:

      ul {
    margin-left: 2em;
    padding-left: 1em;
    list-style-type: disc;
}

li {
    list-style-type: disc;
    color: #f00;
}

li > span {
    color: #000;
}

      JS Fiddle demo.

      Erklärung:

      Den Grund für die span innerhalb der li Elemente ist, dass die text-Farbe von der 'Kugel' (list-style-type: disc;) kann nicht geändert werden, unabhängig vom text der li selbst. Mit der span ermöglicht die text enthalten sein, der eine andere color auf die 'Kugel.'

      Dies ist teilweise in Bezug auf meine eigene Frage: Wie Farbe die list-style-type der aut-generierten zahlen?.

      Jedoch die Frage beantworten, die da fragte:

      Mit dem folgenden Bild:
      Red dot ähnlich

      Folgende css-arbeiten:

      td {
    background: #fff url(http://i.stack.imgur.com/Q5lQ4.gif) 0 50% no-repeat;
    padding-left: 14px;
}

      JS Fiddle demo.

      Überlasse ich es ganz dir zu finden eine tatsächliche rote Kugel Bild.

      • Sie können auch ändern, die font-size Eigenschaft auf die li zum ändern der Größe der Kugel.
      • gerne helfen! 🙂
      InformationsquelleAutor David Thomas
    2. 5

      Wenn Sie wollen, tun es die einfachste Art und Weise möglich ist, können Sie eine HTML-entity-Kugel: •

      &bull; (nicht gültig xhtml)

      oder

      &#8226;

      Können Sie wickeln Sie es in ein span-Farbe, wie gebraucht.

      InformationsquelleAutor Elocution Safari
    3. 0

      Web-Design-Bibliothek So Ordnen Sie Benutzerdefinierte Liste mit Aufzählungszeichen mit CSS hat ein tutorial, das verwendet die list-style-image CSS-Eigenschaft auf ein Bild festlegen.

      InformationsquelleAutor Mārtiņš Briedis
    Schreibe einen Kommentar