Học trọn bộ Front end
Website hay chuyên frontend và backend https://fullstack.edu.vn/
Website hay chuyên frontend và backend https://fullstack.edu.vn/
Các bạn truy cập trang chủ https://ckeditor.com/ckeditor-4/download/ Tùy chỉnh thanh toolbar https://ckeditor.com/latest/samples/toolbarconfigurator/index.html#basic
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
<span style="font-family: arial, helvetica, sans-serif;"><script src="//cdn.ckeditor.com/4.6.2/full/ckeditor.js"></script> <script> CKEDITOR.replace('content', { height: 250, disallowedContent: 'a table tr td form input select script br' }); CKEDITOR.config.toolbarGroups = [ { name: 'document', groups: [ 'mode', 'document', 'doctools' ] }, { name: 'clipboard', groups: [ 'clipboard', 'undo' ] }, { name: 'editing', groups: [ 'find', 'selection', 'spellchecker', 'editing' ] }, { name: 'forms', groups: [ 'forms' ] }, { name: 'styles', groups: [ 'styles' ] }, { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] }, '/', { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi', 'paragraph' ] }, { name: 'links', groups: [ 'links' ] }, { name: 'insert', groups: [ 'insert' ] }, { name: 'colors', groups: [ 'colors' ] }, { name: 'tools', groups: [ 'tools' ] }, '/', { name: 'others', groups: [ 'others' ] }, { name: 'about', groups: [ 'about' ] } ]; CKEDITOR.config.removeButtons = 'Save,NewPage,ExportPdf,Preview,Print,Templates,Paste,PasteText,PasteFromWord,Scayt,SelectAll,Form,Checkbox,Radio,TextField,Textarea,Select,Button,ImageButton,HiddenField,Language,Anchor,Flash,SpecialChar,Iframe,About,CreateDiv,Smiley,Superscript,Subscript,BidiRtl,BidiLtr,Styles,Undo,Redo,Replace,CopyFormatting,Cut,Copy'; </script></span> |
LOẠI BỎ CÁC SCRIPT QUẢNG CÁO, CÁC THUỘC TÍNH KHÔNG THEO NHU CẦU, CÓ THỂ CẤU HÌNH NHƯ BÊN DƯỚI
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<span style="font-family: arial, helvetica, sans-serif;"><script src="https://cdn.ckeditor.com/4.6.2/full/ckeditor.js"></script> <script> CKEDITOR.replace('content', { height: 250, disallowedContent: 'a table tr td form input select script br', allowedContent:'img[!src]{float}; b(*); p(*); em(*); u(*);span(*);' }); CKEDITOR.config.toolbar = [ { name: 'document', items : [ 'Source','-','DocProps','Preview','-','Templates' ] }, { name: 'clipboard', items : [ 'Cut','Copy','Paste','-','Undo','Redo' ] }, { name: 'editing', items : [ 'Find','Replace','-','SelectAll', ] }, { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] }, { name: 'tools', items : [ 'Maximize', 'ShowBlocks','-','About' ] } ]; </script></span> |
Các bạn làm theo hướng dẫn bên dưới Code CSS:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
.iframe-container{ position: relative; width: 100%; padding-bottom: 56.25%; height: 0; } .iframe-container iframe{ position: absolute; top:0; left: 0; width: 100%; height: 100%; } |
Ví dụ:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<style> .iframe-container{ position: relative; width: 100%; padding-bottom: 56.25%; height: 0; } .iframe-container iframe{ position: absolute; top:0; left: 0; width: 100%; height: 100%; } </style> <div class="iframe-container"><iframe class="" width="560" height="315" src="https://www.youtube.com/embed/9YffrCViTVk" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div> |
Để thành thạo các bạn cần có kiến thức liên quan, html, css, javascript Tài liệu liên quan đến các lệnh và hàm trong lập trình plugin extensions: https://developer.chrome.com/extensions/overview Các ví dụ: https://developer.chrome.com/apps/richNotifications Có thể học bằng cách tải các extensions của người khác về mổ… Read More