<!-- classで「required」を付けた文字の後ろに必須マークが出る --><h:outputTextstyleClass="required"value="好きな生き物"/>

.required::after{content:" *";color:red;vertical-align:middle;}

.required::after{content:"必須";background-color:#f0ad4e;color:#fff;font-size:12px;font-weight:bold;min-width:10px;padding:3px7px;margin:0px5px;line-height:1;vertical-align:middle;white-space:nowrap;text-align:center;border-radius:10px;display:inline-block;}