PHOTOLAND

한국어

Knowledge

오늘:
282
어제:
511
전체:
715,117

간단한 HTML 코드를 이용해서 브라우저에 오프라인 메모장을 만들 수 있다. 이 방법은 웹 페이지의 어느 부분이나 텍스트 편집을 위한 인터렉티브 영역으로 바꿀 수 있는 ‘콘텐츠 편집이 가능한’ HTML의 특징을 활용한 것으로, 구글 크롬, 모질라 파이어폭스, 오페라에서 이용할 수 있다.


먼저 앞서 언급한 브라우저 중 하나에서 빈 탭을 연다. 그리고 아래의 HTML 코드를 복사한다. 사실, 온라인에는 HTML 메모장 코드가 존재하지만, 이 코드가 가장 잘 작동한다. 이 HTML 코드는 런던의 웹 디자이너이자 개발자인 마이크 프란시스가 지난 5월 말에 트위터에 올린 것이다.

data:text/html, <body contenteditable style="font: 2rem/1.5 monospace;max-width:60rem;margin:0 auto;padding:4rem;">

이 코드를 복사한 다음, 새 브라우저 탭에 이를 붙여넣고, 엔터를 누른다.



메모 저장하기


이 방법의 단점은 브라우저 전체나 메모 탭을 닫을 때마다 메모 내용이 사라진다는 것이다. 그래서 이 방법은 저장할 필요가 없는 메모를 할 때 유용하다. 예를 들어 필자는 모아둘 필요가 없는 오늘의 할 일 목록을 적을 때 사용한다.

하지만 메모를 저장하고 싶다면, 몇 가지 방법을 이용할 수 있다. 먼저 모든 브라우저는 해당 메모를 HTML 문서로 저장하도록 지원한다. 크롬에서는 오른쪽 상단의 메뉴 아이콘(가로줄 3개 모양)을 클릭한 다음, ‘페이지를 다른이름으로 저장’을 선택하면 된다. 원하는 파일이름을 넣고 나중에 메모를 브라우저에서 열어 볼 수 있다.

또는, 메모 내용을 일반 메모장을 열어서 복사/붙여넣기를 하고 저장할 수도 있다.

파이어폭스의 경우엔 탭을 텍스트로 저장하는 기능을 보유하고 있어서, 저장을 목적으로 할 때에는 가장 좋은 브라우저가 될 것이다. 윈도우 8.1에서 파이어폭스 29.0.1을 구동하는 경우에, 파이어폭스의 메뉴 아이콘을 클릭하고, ‘페이지 저장’을 선택한다.

탐색기 창이 열리면, 파일 형식의 드롭다운 메뉴에서 ‘텍스트 파일’을 선택한다. 다음에 해당 메모를 열 때에는 일반 메모장에서 열 수 있다.

조회 수 :
35988
등록일 :
2015.08.22
19:20:59 (*.131.135.137)
엮인글 :
http://www.potoland.net/xe/355183/104/trackback
게시글 주소 :
http://www.potoland.net/xe/355183

'2' 댓글

홍석균

2015.08.23
11:19:20
(*.110.179.48)

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    </head>

 <body>

  <iframe name="TextBody" id="TextBody" style="border:1px solid #f00; width:700px; height:300px;"></iframe>

            <script  type="text/javascript">
                frames.TextBody.document.designMode="On";
            </script>

 </body>
</html>



위의 내용을 test.html로 저장하신 후 브라우저로 열면 웹에디터가 됩니다.

파일로 저장은 안 됩니다만...

leekyoo

2015.08.23
11:22:15
(*.131.135.137)

감사합니다.

문서 첨부 제한 : 0Byte/ 2.00MB
파일 제한 크기 : 2.00MB (허용 확장자 : *.*)
옵션 :
:
:
:
:
List of Articles
번호 제목 글쓴이 날짜 조회 수
46 단축키 LeeKyoo 2019-09-08 35136
45 두둑한 연봉을 위한 10가지 프로그래밍언어 LeeKyoo 2018-02-01 33000
44 CES 2018 LeeKyoo 2018-01-08 29208
43 카카오뱅크, 은행 IT에 새 이정표를 제시했다 leekyoo 2017-08-11 31953
42 어뗜 언어를 배워야 할까? LeeKyoo 2017-01-22 35186
41 코딩공부 LeeKyoo 2017-01-03 30997
40 apache, php, mysql 통합설치 [3] 홍석균 2016-12-02 29271
39 기본적인 컴퓨터 용어 LeeKyoo 2016-11-27 29609
38 컴퓨터 조립 LeeKyoo 2016-10-17 27711
37 스마트폰으로 cctv 만들기 [1] file leekyoo 2016-04-20 26188
» 브라우저를 메모장으로 [2] leekyoo 2015-08-22 35988
35 부팅후 하드디스크 무작정 읽어 대니.. [6] 셀라비 2015-06-25 31019
34 링크연습 [2] 셀라비 2015-06-22 28478
33 hdd 건강상태 체크 [1] 이규 2015-05-30 32269
32 윈도우7 뻘팁 하나. 셀라비 2015-02-05 27885
31 관리자권한으로 실행 셀라비 2015-01-01 27118
30 구글 크라우드 드라이브 [1] 셀라비 2014-11-21 29387
29 :: 봇(bot) :: 셀라비 2014-04-23 31816
28 스팸 게시글 작성자 IP차단 하는 방법 [1] 홍석균 2014-04-02 31160
27 갤럭시 s5 셀라비 2014-02-05 30284