Como editar el titulo "H2"

Quiero que mis titulos tengan este modelo:



Me dijeron que editando el modelo del "H2" y agregandole un nombre lo podria convertir como aquel, que me recomiendan ustedes?

Puedes hacer las dos cosas.
O bien te creas una clase y se la aplicas a los textos que quieras, o bien editas la etiqueta h2
Puedes hacerlo como cualquier otra clase pero sin ningún signo puntuación

Código :

h2 {
font-size:1em;
color:red;
}

Edite el codigo de este modo:

Código :

h2 {font-size:25px;color:#FFF;text-transform:uppercase; font-weight:bold; background-color:#ef3f4e; margin:10px 0 0 0;line-height:18px;}

Me quedo algo asi:


Quisiera sacar el tipo de fuente y como acortar el marco de fondo como a 10px terminando el titulo como en la imagen anterior.

Yo no veo la primera imagen. No sé cómo quieres que quede

a sorry creo que lo han eliminado el punto es que no siga después que termine el texto osea ni bien termine el texto ya no siga la raya roja

Perdona por tardar en responderte pero entre el trabajo de última hora y las Navidades no he parado.
Ahora creo que sé lo que quieres y la mejor forma para mí sería que añadieras en el CSS:

Código :

h2 {
display: inline;
}

y todo solucionado.
Lo he probado y funciona.

Yo lo pondría algo así:

Código :

h2 {
font-size: 25px;
color: #fff;
text-transform: uppercase;
font-weight: bold;
line-height: 18px;
display:inline;
padding: 3px 5px;
background-color: #ef3f4e;
}

para que no quede el texto pegado a los bordes del color.
El "margin" no te vale para h2, sería ponerle en el CSS:

Código :

h2 span {
margin: 10 0 0 0;
}

y encerrar el texto entre etiquetas <span>

Código :

<h2><span>textoquequieras</span></h2>