워드랩(안튀어나오게 글쓰기)

조수경·2021년 11월 9일
0

HTML

목록 보기
32/96
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
div{
  width : 50%;
  height : auto;
  margin : 10px;
  border : 1px dotted red;
}
#d2{
  word-wrap: break-word;
}
#d3{
  word-wrap: break-word;
}
</style>
<script>
  function proc(){
	  //id가 d3인 div요소로 접근
	  vd3 = document.getElementById("d3");
	  
	  
	  //Hello라는 글자를 만들어 추가한다.
	  //글자 만들기
    	txt = document.createTextNode("Hello");
	  //vd3에 추가하기
	  vd3.append(txt);
  }
</script>
</head>
<body>
<div>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
</div>

<div id="d2">
word-warp : break-word;<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
</div>

<div id="d3">
word-warp : break-word;<br><br>
 //id가 d3인 div요소로 접근
	  vd3 = document.getElementById("d3");<br>
	  
	  
	  //Hello라는 글자를 만들어 추가한다.<br>
	  //글자 만들기<br>
    	txt = document.createTextNode("Hello");<br>
	  //vd3에 추가하기<br>
	  vd3.append(txt);<br><br>
</div>
<input type="button" onclick="proc()" value="확인">
</body>
</html>

profile
신입 개발자 입니다!!!

0개의 댓글