본문 바로가기

필기3

그리드grid 그리드grid생활코딩_web2_css_10.그리드_필기노트 div block level span inline display:grid; grid-template-columns: 150px 1fr; 150px 1fr 왼쪽 150px로 고정 1fr 1fr 1:1 2fr 1fr2:1 div id="" 로 그리드 구분#grid>ol {} 로 ordered line 구분 도움이 되는 사이트 : caniuse.com 현재까지 진도를 따라가며 만든 나의 웹페이지하..어썸하다 증말... 🤩🤩 2019. 2. 8.
css 박스모델 생활코딩_web2_8.박스모델_필기노트 /* block level element */ h1 { border-width:5px; border-color:red; border-style:solid; display:inline } /* inline element */ a { display:none } 참고: /**/ : css 중복을 줄이자 박스 padding:200px; 박스와 박스내부의 컨텐츠 사이의 간격 inline으로 적용해봤을 땐 윗부분이 짤려서(?) 나옴... margin 값 조정해도 짤림 width:10px; padding값이 우선이고(순서바꿔서해봄), 박스 오른쪽 부분이 마지막 글자로부터 10px 떨어짐 margin:100px; 박스와 박스 외부의 컨텐츠 사이의 간격 페이지에서 오른쪽버튼 - 요.. 2019. 2. 8.
css 선택자/selector CSS 선택자/selector 필기노트생활코딩_wed2_7.CSS 선택자의 기본 font-size:2000pxtext-align:center .class.saw { color:grey; }class="saw" .active { color:red; }class="saw active" #id우선순위 - 원래는 마지막에 입력한 선택자가 우선 적용됨. 순서에 상관 없이 우선으로 적용하고 싶으면 태그 > class > id문서 내에서 id는 중복적용 안됨. 한 번만 등장해야함 #active { color:red }id="active" css selector 종류/예제 2019. 2. 8.