본문 바로가기

Programming/HTML

리스트 가리기 (details), 리스트

detailsSummaryList.html

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<style>
#ulCss {
	color: blue;
}

ol {
	color: red;
}

.spanCss {
	color: black;
}
</style>
</head>
<body>

	<details>
		<summary> 올바른 개발자 생활</summary>

		<ul id='ulCss'>
			<li>쉬는 시간에 5분정도 먼 곳을 바라본다.</li>
			<li>1시간마다 스트레칭을 한다.</li>
			<li>거북목이 되지 않도록 목을 편다.</li>
		</ul>
	</details>

	<dl>
		<dt>연수생 수칙</dt>

		<ol>
			<li>지각하지 않기</li>
			<li>결석하지 않기</li>
			<span class='spanCss'>(불가피할 땐 꼭 담당연구원에게 미리 말하기)</span>
			<li>복습하기</li>
		</ol>
	</dl>
</body>
</html>