[21.09.17] exam04(05_cssPositioning) - float / text-align: justify(양쪽정렬)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
#float {
float: right; 오른쪽으로 밀려서 나온다.
border: 1px solid black;
width: 7em;
padding: 0.25em;
margin: 1em;
}
.text1 {
margin-right: 10em; 오른쪽 여백 10em
text-align: justify; 양쪽정렬
}
.text2 {
clear: both;
}
</style>
</head>
<body>
<h3>학기말 공지</h3>
<hr>
<div>
<p id="float">
24일은 피아니스트 조성진의 크리스마스 특별 연주가 있습니다.</p>
<p> 태그를 쓰면 줄바꿈이 일어나기 때문에 문장과 문장 사이 약간의 공백이 나타나는 걸 확인할 수 있다.
<p>태그가 아닌 <div>로 잡게되면 문장과 문장이 달라붙어서 나온다.
<p class="text1">
이제 곧 겨울 방학이 시작됩니다. 학기 중 못다한 Java, C++ 프로그래밍 열심히 하기 바랍니다.
인턴을 준비하는 학생들은 프로젝트 개발에 더욱 힘쓰세요. 그럼 다음 학기에 만나요.</p>
<p class="text2">
이제 곧 겨울 방학이 시작됩니다. 학기 중 못다한 Java, C++ 프로그래밍 열심히 하기 바랍니다.
인턴을 준비하는 학생들은 프로젝트 개발에 더욱 힘쓰세요. 그럼 다음 학기에 만나요.</p>
</div>
</body>
</html>