배움44 그리드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. css란? - html과의 차이를 중심으로 CSS란? html과의 차이점을 중심으로생활코딩_wed2_CSS_4.CSS의 기본문법__필기-HTML에서 '정보'와 '디자인'을 분리하기 위해 고안된 것-디자인에 관한 것을 따로 떼어내서 관리하기 위한 것. -태그를 썼을 때 중복됐던 것들을 한꺼번에 관리 가능. -더하기와 곱하기의 관계로 비유할 수 있을 것 같다. HTML 태그 : 2+2+2+2+2CSS : 2*5 -때문에 새로운 것을 공부해야 하지만 일단 익히고 나면 편리하고 효율적이다. -html과 css 사용 비교html 내용 css 방법1 a {} : selector 셀렉터color:red :declaration 선언자color: propertyred : property value css 방법2 - html의 속성 내용 -css 종류color:r.. 2019. 2. 6. 이전 1 ··· 6 7 8 9 다음
