Cómo usar HTML y CSS para ingresar el código HTML en la página web y luego presionar el botón para lograr el efecto

?\n\ n#grad1?{\naltura:?200px;\n\tfondo-color:?rojo;?\/*?\u6d4f\u89c8\u5668\u4e0d\u652f\u6301\u65f6\u663e\u793a?*\/\nfondo -image:?linear-gradient(#e66465,?#9198e5);\n}\n<\/style>\n<\/head>\n\n\n

\u7ebf\u6027\ u6e10\u53d8?-?\u4ece\u4e0a\u5230\u4e0b<\/h3>\n

\u4ece\u9876\u90e8\u5f00\u59cb\u7684\u7ebf\u6027\u6e10\u53d8\u3002\u8d77\u70 b9 \u662f\u7ea2\u8272\uff0c\u6162\u6162\u8fc7\u6e21\u5230\u84dd\u8272\uff1a<\/p>\n\n<\/div> \ n\n

\u6ce8\u610f\uff1a<\/strong>?Internet?Explorer?9?\u53ca\u4e4b\u524d\u7684\u7248\u672c\u4e0d\u652f\u6301\u6e10\u53d8 \ u3002<\/p>\n\n<\/body>\n<\/html>"

editor.getDoc().setValue(initCode);

submitTryit ( );

}

función?submitTryit()?{

var?text?=?editor.getValue();

var?patternHtml?=?/]*>((.|[\n\r])*)<\/html>/im

var?patternHead?=?/ < head[^>]*>((.|[\n\r])*)<\/head>/im

var?array_matches_head?=?patternHead.exec(texto);

var?patternBody?=?/]*>((.|[\n\r])*)<\/body>/im;

var? array_matches_body ?=?patternBody.exec(texto);

var?basepath_flag?=?1;

var?basepath?=

?'';

if?(array_matches_head)?{

text?=?text.replace('',?''?+?basepath) ;

}?else?if?(patternHtml)?{

text?=?text.replace('',?''?+?basepath ?+?'');

}?else?if?(array_matches_body)?{

text?=?text.replace('', ?''?+?basepath);

}?else?{

text?=?basepath?+?text;

}

var?iframe?=?document.createElement("iframe");

iframe.setAttribute("frameborder",?"0");

iframe .setAttribute("id",?"iframeResult");

iframe.setAttribute("width",?"100%");

document.getElementById("iframewrapper") .innerHTML?=?"";

document.getElementById("iframewrapper").appendChild(iframe);

var?ifrw?=?(iframe.contentWindow)iframe.contentWindow ?:?(iframe.contentDocument.document)iframe.contentDocument.document?:?iframe.contentDocument;

ifrw.document.open();

ifrw.document.write( texto);

ifrw.document.close();

autodivheight();

}

submitTryit(); p>

autodivheight();

Por favor adopte