style 코드에 float 속성 대신에 div align 속성을 사용하자!
동영상으로 우선 감상해보겠습니다. :p
1) float 속성을 주지 않은 경우 : 더블클릭했을 때 블럭 설정이 된다.
2) float 속성을 준 경우 : 더블클릭해도 블럭 설정이 되지 않는다.
에디트모드(F7 or Ctrl+E)에서 글을 쓸 때 정해진 양식에서 글을 쓰게 됩니다.
jwFreeNote는 텍스트폼으로 이루어진 에디터가 아니라, 일반 HTML 문서같이 스프링노트에서 입력하듯이 입력을 할 수 있는
도구이기 때문에 글을 입력하는데 있어서 효율적으로 글을 쓰고 볼 수 있는 양식이 중요하고 글을 쓸 때 간편해야 합니다.
저 같은 경우에는 다음과 같은 양식에서 글을 작성합니다.
제목, 날짜, 내용 부분을 위의 1번 동영상에서 보시다시피 더블클릭을 클릭하면 바로 입력이 될 수 있게끔 해놓았는데
div 속성에 float을 넣은 2번 영상을 보시다시피 float 속성을 준 레이어에서는 더블클릭을 해도, 블럭 설정이 안되더군요.
<div style="float:right;"></div> 과 같은 코드를 <div align="right"></div>로 수정하니 잘 되더라고요. ^^
사용한 코드 (일부분입니다.)
아래 코드는 위의 동영상에서 사용된 코드입니다.
위에서 언급한 올바른 사용은 float:right 속성을 빼주어야 한다는 겁니다.
(중략)
<style type="text/css">
body {background:#FFF7B5;font-family:한겨레결체;font-size:14px;margin:10px;}
.keyword td {padding:5px;color:#FFFFFF;font-family:굴림,gulim;font-size:10pt;}
.Title {border-bottom:2px solid black;margin:7px;clear:both;}
.Date {float:right;}
.memo {}
hr {color:#CACACA;height:1px;}
.link {font-size:8pt; font-family:돋움;dotum;}
#memobox {width:700px;}
#KeywordBox {padding:5px;color:#FFFFFF;font-family:굴림,gulim;font-size:10pt;width:700px;}
</style>
</head>
<body>
<table id="MemoBox" class="MemoBox" rbgcolor="#F8F8F8" rborder="#999999" radius="3">
<tr><td>
<div class="title">jwMP Player</div>
<div class="date" align=right>2007. 11. 29</div>
<div class="memo">
<p><IMG class=iePngFix title=jwmp_prtsc.png alt=jwmp_prtsc.png src="__071129_jwMP\jwmp_prtsc.png"></p>
<p> </p>
<p></p>
<p></p>
</div>
(중략)
동영상으로 우선 감상해보겠습니다. :p
1) float 속성을 주지 않은 경우 : 더블클릭했을 때 블럭 설정이 된다.
2) float 속성을 준 경우 : 더블클릭해도 블럭 설정이 되지 않는다.
에디트모드(F7 or Ctrl+E)에서 글을 쓸 때 정해진 양식에서 글을 쓰게 됩니다.jwFreeNote는 텍스트폼으로 이루어진 에디터가 아니라, 일반 HTML 문서같이 스프링노트에서 입력하듯이 입력을 할 수 있는
도구이기 때문에 글을 입력하는데 있어서 효율적으로 글을 쓰고 볼 수 있는 양식이 중요하고 글을 쓸 때 간편해야 합니다.
저 같은 경우에는 다음과 같은 양식에서 글을 작성합니다.
제목, 날짜, 내용 부분을 위의 1번 동영상에서 보시다시피 더블클릭을 클릭하면 바로 입력이 될 수 있게끔 해놓았는데
div 속성에 float을 넣은 2번 영상을 보시다시피 float 속성을 준 레이어에서는 더블클릭을 해도, 블럭 설정이 안되더군요.
<div style="float:right;"></div> 과 같은 코드를 <div align="right"></div>로 수정하니 잘 되더라고요. ^^
사용한 코드 (일부분입니다.)
아래 코드는 위의 동영상에서 사용된 코드입니다.
위에서 언급한 올바른 사용은 float:right 속성을 빼주어야 한다는 겁니다.
(중략)
<style type="text/css">
body {background:#FFF7B5;font-family:한겨레결체;font-size:14px;margin:10px;}
.keyword td {padding:5px;color:#FFFFFF;font-family:굴림,gulim;font-size:10pt;}
.Title {border-bottom:2px solid black;margin:7px;clear:both;}
.Date {float:right;}
.memo {}
hr {color:#CACACA;height:1px;}
.link {font-size:8pt; font-family:돋움;dotum;}
#memobox {width:700px;}
#KeywordBox {padding:5px;color:#FFFFFF;font-family:굴림,gulim;font-size:10pt;width:700px;}
</style>
</head>
<body>
<table id="MemoBox" class="MemoBox" rbgcolor="#F8F8F8" rborder="#999999" radius="3">
<tr><td>
<div class="title">jwMP Player</div>
<div class="date" align=right>2007. 11. 29</div>
<div class="memo">
<p><IMG class=iePngFix title=jwmp_prtsc.png alt=jwmp_prtsc.png src="__071129_jwMP\jwmp_prtsc.png"></p>
<p> </p>
<p></p>
<p></p>
</div>
(중략)