< div> 태그
:의미x, block level element.줄바꿈o
< span> 태그
::의미x, inline element.줄바꿈x
< head>
< style>
#grid{
border:5px solid pink;<한번에 배치 가능
display:grid;<화면 표시 특성 바꾸는
grid-template-columns:150px 1fr;
>grid-template:나란히
columns:열,row:행
150px:고정
1fr:나머지
텍스트 두개를 나란히 배치시키려면, 그것을 감싸는 '부모 태그'필요.
< body>
< div id="grid"> < 부모태그
< div> < 자식태그
< div>
in < head>
#grid ol
<수많은 이 ol중에서 grid밑에 있는 이 ol