imagen en esquina inclinada

[urgido]

hola he escrito este post en el lugar equivocado:

Código HTML:

http://www.forosdelweb.com/showthread.php?t=409817

dónde pregunto como se hace el efecto de poner una banda en la esquina superior de la derecha me sugirieron ver el código fuente y lo he hecho y ya funciona en mi sitio web el problema es que con imágenes con el texto escrito y quisiera ver la forma si existe un efecto de poner el texto que yo quiera sin la necesidad de escribirlo directamente a la imagen. A quí les dejo el código fuente por si a alguien le interesa:

Código HTML:

document.write('<style><!-- @import url(http://gallery.makepovertyhistory.com.au/mph/whiteband.css); --></style>'
+ '<div class="MPHWhiteBandSmallRight"><img src="http://gallery.makepovertyhistory.com.au/mph/whiteband_mphtranslinkimg.gif" width="163" height="163" border="0" usemap="#MPHLinkMapSmallRight" class="mphimage"></div>'
+ '<map name="MPHLinkMapSmallRight"><area shape="poly" coords="0,0,163,163,163,133,30,0" href="http://www.makepovertyhistory.com.au/" target="_blank"></map>'
);

Código HTML:

div.MPHWhiteBandSmallRight			{
		position:absolute;
		left:100%;
		top:0px;
		overflow:visible;
		height:163px;
		width:163px;
		background-image:url(http://gallery.makepovertyhistory.com.au/mph/whiteband_small_right.gif);
		background-repeat:no-repeat;
		background-position:-70px -75px;
		background-color:transparent;
		margin:0 0 0 -163px;
		padding:0;
		color:#000;
		font-family:helvetica,verdana,arial,tahoma,sans-serif;
		z-index:1000000000;
		border:none;
		float:none;
}