Round Rahmen um Text

Question

Wie kann ich den Effekt anzuwenden in das Bild mit CSS

<div class="textstyle"><b>Sales Cash Invoice</b></div> 

Answer 1

HTML gezeigt:

<div class="textstyle">Sales Cash Invoice</div>

CSS:

.textstyle { 
    background-color: gray; /* Changing background color */ 
    font-weight: bold; /* Making font bold */ 
    border-radius: 20px; /* Making border radius */ 
    width: auto; /* Making auto-sizable width */ 
    height: auto; /* Making auto-sizable height */ 
    padding: 5px 30px 5px 30px; /* Making space around letters */ 
    font-size: 18px; /* Changing font size */ 
} 

Wenn Sie Schriftart hinzufügen möchten, fügen Sie einfach eine neue Zeile CSS font-family: font_name;. Ich kann das nicht tun, weil ich nicht weiß, welche Schriftart auf dem Bild ist.

Für eine genauere Farben verwenden Sie Color Picker.

Answer 2

.textstyle { 
    background: #CDCDCD; 
    border-radius: 0.25em; 
} 

https://developer.mozilla.org/en/docs/Web/CSS/border-radius