체험하기
HTML |
---|
<!-- external modules --> <script type="text/javascript" src='https://www.synapeditor.com/se/resource/synapeditor/externals/formulaParser/formula-parser.min.js'></script> <script type="text/javascript" src='https://www.synapeditor.com/se/resource/synapeditor/externals/SEDocModelParser/SEDocModelParser.min.js'></script> <script type="text/javascript" src='https://www.synapeditor.com/se/resource/synapeditor/externals/SEShapeManager/SEShapeManager.min.js'></script> <script type="text/javascript" src='https://www.synapeditor.com/se/resource/synapeditor/externals/codeMirror/codemirror.min.js'></script> <script type="text/javascript" src="https://www.synapeditor.com/se/resource/synapeditor/externals/codeMirror/xml.min.js"></script> <link rel='stylesheet' href='https://www.synapeditor.com/se/resource/synapeditor/externals/codeMirror/codemirror.min.css'> <!-- Synap Editor --> <script src='https://www.synapeditor.com/se/resource/synapeditor/synapeditor.config.js'></script> <script src='https://www.synapeditor.com/se/resource/synapeditor/synapeditor.min.js'></script> <link href='https://www.synapeditor.com/se/resource/synapeditor/synapeditor.min.css' rel='stylesheet' type='text/css'> <div style="background-color: #ffffff; width:99%; height:500px;"> <div id="synapEditor"> <p style="overflow-wrap: break-word;"> <span>편집영역에서 특정한 글자나 문장을 찾거나 바꿉니다.</span> </p> <br> <p style="overflow-wrap: break-word;"> <span style="font-size: 18pt;">찾기</span> </p> <ul class="se-list"> <li class="se-list-item" data-level="0" data-startval="1" data-text="●" data-format="bullet" data-margin-left="0px" data-list-position="outside" style="list-style: none; margin-left: -4.125px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-weight: bold; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">●</span> <span style="font-weight: bold; color: rgb(0, 128, 128);">찾을 내용</span> <span> : 찾을 내용을 입력합니다.</span> </p> </li> <li class="se-list-item" data-level="0" data-startval="1" data-text="●" data-format="bullet" data-margin-left="0px" data-list-position="outside" style="list-style: none; margin-left: -4.125px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-weight: bold; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">●</span> <span style="font-weight: bold; color: rgb(0, 128, 128);">찾기 옵션</span> <span> :</span> </p> </li> <li class="se-list-item" data-level="1" data-startval="1" data-text="○" data-format="bullet" data-margin-left="40px" data-list-position="outside" style="list-style: none; margin-left: 35.875px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">○</span> <span style="color: rgb(0, 128, 128);">대소문자 구분 </span> <span>: 체크를 하면 대문자와 소문자를 구분하여 내용을 찾습니다.</span> </p> </li> <li class="se-list-item" data-level="0" data-startval="1" data-text="●" data-format="bullet" data-margin-left="0px" data-list-position="outside" style="list-style: none; margin-left: -4.125px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-weight: bold; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">●</span> <span style="font-weight: bold; color: rgb(0, 128, 128);">찾기</span> <span> : 찾을 내용에 입력한 내용을 하나씩 찾습니다.</span> </p> </li> </ul> <p style="overflow-wrap: break-word;"> <br> </p> <p style="overflow-wrap: break-word;"> <span style="font-size: 18pt;">바꾸기</span> </p> <ul class="se-list"> <li class="se-list-item" data-level="0" data-startval="1" data-text="●" data-format="bullet" data-margin-left="0px" data-list-position="outside" style="list-style: none; margin-left: -4.125px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-weight: bold; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">●</span> <span style="font-weight: bold; color: rgb(0, 128, 128);">찾을 내용</span> <span> : 찾을 내용을 입력합니다.</span> </p> </li> <li class="se-list-item" data-level="0" data-startval="1" data-text="●" data-format="bullet" data-margin-left="0px" data-list-position="outside" style="list-style: none; margin-left: -4.125px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-weight: bold; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">●</span> <span style="font-weight: bold; color: rgb(0, 128, 128);">바꿀 내용</span> <span> : 바꿀 내용을 입력합니다.</span> </p> </li> <li class="se-list-item" data-level="0" data-startval="1" data-text="●" data-format="bullet" data-margin-left="0px" data-list-position="outside" style="list-style: none; margin-left: -4.125px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-weight: bold; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">●</span> <span style="font-weight: bold; color: rgb(0, 128, 128);">찾기 옵션</span> <span> :</span> </p> </li> <li class="se-list-item" data-level="1" data-startval="1" data-text="○" data-format="bullet" data-margin-left="40px" data-list-position="outside" style="list-style: none; margin-left: 35.875px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">○</span> <span style="color: rgb(0, 128, 128);">대소문자 구분</span> <span> : 체크를 하면 대문자와 소문자를 구분하여 내용을 찾습니다.</span> </p> </li> <li class="se-list-item" data-level="0" data-startval="1" data-text="●" data-format="bullet" data-margin-left="0px" data-list-position="outside" style="list-style: none; margin-left: -4.125px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-weight: bold; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">●</span> <span style="font-weight: bold; color: rgb(0, 128, 128);">바꾸기</span> <span> : 찾을 내용에 입력한 내용을 하나씩 찾아서 바꿀 내용으로 변경합니다.</span> </p> </li> <li class="se-list-item" data-level="0" data-startval="1" data-text="●" data-format="bullet" data-margin-left="0px" data-list-position="outside" style="list-style: none; margin-left: -4.125px;"> <p style="overflow-wrap: break-word; margin: 0px;"> <span class="se-list-type" style="pointer-events: none; position: relative; display: inline-block; font-weight: bold; font-family: Arial; color: rgb(0, 128, 128); margin-left: -8.875px; width: 8.875px; left: -10px;">●</span> <span style="font-weight: bold; color: rgb(0, 128, 128);">모두 바꾸기</span> <span> : 찾을 내용에 입력한 내용과 일치하는 모든 내용을 바꿀 내용으로 변경합니다.</span> </p> </li> </ul> </div> </div> <script> const config = Object.assign(synapEditorConfig, { "editor.license":"/se/resource/license.json", "editor.toolbar": ["find"], "editor.menu.show": false, "editor.import.maxSize": 10485760, "editor.import.api": "/se/importDoc", "editor.upload.maxSize": 3145728, "editor.upload.image.api": "/se/uploadFile", "editor.upload.video.api": "/se/uploadFile", "editor.upload.file.api": "/se/uploadFile" }); window.editor = new SynapEditor("synapEditor", config, document.getElementById('synapEditor').innerHTML); </script> |
...