在 VS2013的ASPNET網(wǎng)站開發(fā)中用 xheditor v1.1.13 作為HTML編輯器_html/css_WEB-ITnose
Jun 24, 2016 am 11:48 AM
要用vs2013開發(fā)一個(gè)博客網(wǎng)站,.net ? framework ?4,需要一個(gè)HTML編輯器作為寫文章的工具。經(jīng)多方試用,排除了dotnettextbox、kceditor。覺得xheditor 不錯(cuò),現(xiàn)將使用方法記錄如下:
1.到http://download.csdn.net/download/chenhaoying/4274663下載,會(huì)得到一個(gè)名為:“xheditor-1.1.13在asp.net中使用.rar”的文件。
2.用vs2013新建一個(gè)網(wǎng)站,網(wǎng)站名任何,此例為Test4hxEditor.如下圖。
3.將xheditor-1.1.13在asp.net中使用.rar 文件中的xheditor_emot、xheditor_skin兩個(gè)文件夾及xheditor-1.1.13-zh-cn.min.js、jquery-1.4.4.min.js兩個(gè)文件解壓到上網(wǎng)站所在的文件夾“d:\快盤\Test4hxEditor”內(nèi)。
4.在vs2013內(nèi)為TestfhxEditor添加一個(gè)Web窗體,此例中名為Default。
5.在vs2013內(nèi)打開Default.aspx文件,修改如下,其中粗體顯示的為修改增加的內(nèi)容。如下所示:
<pre name="code" class="plain"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title></title> <script type="text/javascript" src="jquery-1.4.4.min.js"></script> <script type="text/javascript" src="xheditor-1.1.13-zh-cn.min.js"></script> <script type="text/javascript"> $(document).ready(function () { $('#elm1').xheditor({ tools: 'GStart,Fontface,FontSize,Blocktag,Bold,Italic,Underline,Strikethrough,FontColor,BackColor,Removeformat,Separator,Align,List,Outdent,Indent,Separator,Cut,Copy,Paste,Pastetext,Separator,Link,Unlink,Img,Emot,Table,Separator,About,GEnd', skin: 'default', showBlocktag: false, internalScript: false, internalStyle: false, width: 600, height: 300, loadCSS: 'http://xheditor.com/test.css', fullscreen: false, sourceMode: false, forcePtag: true, upImgUrl: "pictures", upImgExt: "jpg,jpeg,gif,png" }); }); </script>
6.將Default.aspx設(shè)計(jì)視圖下,雙擊其中的"Button"按鈕,進(jìn)入Default.aspx.cs文件的編輯界面,并將其編輯為如下所示:
public partial class _Default : System.Web.UI.Page
{
? ? protected void Page_Load(object sender, EventArgs e)
? ? {
? ? }
? ? protected void Button1_Click(object sender, EventArgs e)
? ? {
? ? ? ? Label1.Text = elm1.Value;
? ? }
}
<span style="font-family: Arial, Helvetica, sans-serif;">7.在vs2013內(nèi)打開Web.config文件,在<system.web></system.web>內(nèi)增加如下內(nèi)容:<httpruntime requestvalidationmode="2.0"></httpruntime>。如下所示。</span>
<span style="font-family: Arial, Helvetica, sans-serif;">? ? <system.web>? ? ? <compilation debug="true" targetframework="4.0"></compilation>? ? ? <httpruntime requestvalidationmode="2.0"></httpruntime>? ? </system.web></span>
8.運(yùn)行網(wǎng)站。出現(xiàn)一個(gè)編輯器,在其中輸入內(nèi)容并編輯,完成后單擊按"Button"按鈕,可將所編輯的內(nèi)容傳給label1。如下圖所示。
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"><img src="/static/imghw/default1.png" data-src="http://img.blog.csdn.net/20150317150808512?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvamh5Y2poeWM=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" class="lazy" style="max-width:90%" alt=""></span>
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"></span>
<span style="font-family:Arial, Helvetica, sans-serif;"><span style="background-color: rgb(255, 255, 255);">至此,xheditor 已基本可用,至于圖片上傳的功能,另文詳述.</span></span>
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"></span>

? AI ??

Undress AI Tool
??? ???? ??

Undresser.AI Undress
???? ?? ??? ??? ?? AI ?? ?

AI Clothes Remover
???? ?? ???? ??? AI ?????.

Clothoff.io
AI ? ???

Video Face Swap
??? ??? AI ?? ?? ??? ???? ?? ???? ??? ?? ????!

?? ??

??? ??

???++7.3.1
???? ?? ?? ?? ???

SublimeText3 ??? ??
??? ??, ???? ?? ????.

???? 13.0.1 ???
??? PHP ?? ?? ??

???? CS6
??? ? ?? ??

SublimeText3 Mac ??
? ??? ?? ?? ?????(SublimeText3)

?? = "Lazy"? HTML ???? ????? ?? ????? ??? ??? ??? ???? ? ????. 1. ??? ??? ?????? ?????, ?? ?? ??? ???, ??? ? ?? ??? ?????. 2. ? ???? ?? ?? ?? ?? ???? ???? ?????. 3. JavaScript? ???? ? ?? ?? ???, ?? ??? ?? ??? ??? ???? ????. 4. ???? ???? ??? ???? ???? ?? ?? ?? ? ?? ??? ?? ??? ??? ???????. ??? ??? ?? ??? ??? ????? ??? ??? ???????.

HTML?? ??? ??? ????? ???? ??? ?? ???, ??? ? SEO ??? ?? ? ? ????. 1. ??? ????? ??? ?? ??? ? ??? ??? ????? ?? ????????. 2. ????? ??? ???? ?? ?? ???? ???? ???? ?? ??? ?????. 3. ? ???? ??? ?? ??? ????? ??? ? ?? ?? ?? ?? ????? ?? ??? ????. ?? ???? ??? ??????? ?? ??? ??? ??? ???? ???? ??? ??? ?? ??? ???? ???????.

????? ??? HTML? ??? ?? ??? ??, ??? ?? ? ??? ? ?????? ???????. 1. ??? ?? ?? ??? ???? ????? HTML5 ??? ?? ?? ????? ??????. 2. ???? ??? ?? ??? ?? ??? ??? ?? ????? ??????. 3. ??? ? SEO? ?? ??? ?? ?? ??????. 4. ?? ?? ?? ???? ???? ?? ?? ?? ???? ???? ?????. ?? ??? ???? ??????. ??? ??? ??? ????? ?? ??? ??????.

? ??? ??? Core HTML ???? ???????. 1. ???? ?? ??? ?? ??? ???? ??? ???? ?? ?? ? ?? ??? ?????. 2. ??? ??? ?? ?? ? SEO? ???? ?? ?? (-), ?? () ? ?? ?? (? :)? ?????. 3. ?????? ???? ????, ????? ???? ??? ???? ????? ?? Aria-Current ??? ???? ?????. 4. ?? ?? ???? ?? ??? ?? ? ?? ??? ?????. ??? ??? ???? ???? ??? ???, ?? ?? ? ?? ?? ???? ?? ? ? ????.

??? HTML? ??? ??? ???? ??? ???? ???? ?? ?? ?????. ??? = "..."? ??? ?? ? ?? CSS ??? ??????. 1. ?? ?? ??? ??? ??? ?? ?? ?? CSS ??????. ? ???? ?????? ?????. ??? ?? ?? : ?? ????. ?? ?? :? ??? ??? ??????. ?? ??? ???? ?? ????? ???????. ? CSS ???? ????? ????????. ?? ??? CSS? ?? ?? ?????. 2. ??? ???? ?? ??? ?????? ?? ??? ???, ??? ??? ?? ? ?? ???? ?????. 3. ????? ? ?? ???? ?? ??? ??? ???? ???, ?? ?? ?? ? ?? ??? ?????.

JavaScript? DOM ??? ?? HTML ??? ???? ??, ??, ?? ? ?????. 1. document.creeLement ()? ???? ? ??? ???? accendChild () ?? insertbefore ()? ?? ???? ??????. 2. QuerySelector () ?? getElementByid ()? ?? ?? ??? ???? TextContent, InnerHtml, setAttribute () ? ?? ???? ???? ?????. 3. ??? ?? ?? ??? ?? ? ? QuerySelectorAll ()? NODELIST? ?????. 4. ??

Thefour Mostimpactfulhtmlattributesforseoarethetitletag, altattribute, hrefattribute, and metadescription.1.theTitleTaginSectionIscrucialasItinformsUsersandsearchEnspage 'scoundents, ??, ???-event, and60 Characters

TheintegrityAttributeNsuresAresouresourcehas? notbeenmodified becryryptographichash, whilecrossoriginhandlescross-originrequeststoenablepropervalidation.1.integritychecksthefile'sauthenticityviasha-256, sha-384, orsha-512HASHASHES, BLOCKINICONCERCOTED
