목록프론트엔드 (54)
gwooden_코린이

1. 연산자 + - * / % ** : 거듭제곱 alert(2 ** 3); let a,b,c; a = b = c = 5; console.log(`a : ${a}`); console.log(`b : ${b}`); console.log(`c : ${c}`); 연결해서 사용은 하지 않음 유지보수에 있어 비효율 2. 비트연산자 & | ^ ~ 3. 논리 연산자 && : and || : or ! : not 4. 일치 연산자 == : 동등 연산자 (데이터 타입 무시) === : 일치 연산자 (데이터 타입까지 체크) //대략적으로 비교해 줌(타입 제외하고 비교) console.log(0==false); // 다 까다롭게 체크해 줌 (타입 포함하고 비교) console.log(1==='1'); console.log(1!..

alert console document // 브라우저 알림참으로 표시 alert('hello js'); //개발환경 콘솔 창에 표시 console.log('hello'); // 웹 페이지에 출력 표시 docyment 방법은 잘 사용안함 document.write('JS'); - 변수 상수 let 변수명; mathScore const 상수; PL let message; message = 'hello'; //작은 따옴표 또는 큰 따옴표 중에 원하는 스타일로 하면 된다. console.log(message); let message; message = 'hello'; console.log(message); message = 12345; console.log(message); let a = 'hello'; le..

1. CSS 그리드(Grid) grid-container grit-item grid-gap(gutter) grid-line grid-number 1 2 3 4 5 6 7 .containter { border: 2px solid red; display: grid; /* 픽셀값으로 (열)너비 조절 (px값은 고정) */ /* grid-template-columns: 200px 100px 200px; */ /* 비율로 (열)너비 조절 */ /* grid-template-columns: 200px 2fr 1fr; */ grid-template-columns: 1fr 1fr 1fr; /* 행 너비 조절 */ grid-template-rows: 100px 100px 100px; /* 해당 하는 컨테이너 높이값이 존..

header aside1 피가 유소년에게서 생의 청춘은 온갖 청춘의 노래하며 끝까지 위하여, 운다. 돋고, 고동을 공자는 품었기 놀이 그러므로 찾아다녀도, 청춘의 주며, 황금시대다. 인생에 행복스럽고 인간은 피에 하는 우리 가슴에 지혜는 이상을 그리하였는가? 피고 붙잡아 가치를 때문이다. 품으며, 길을 같이, 구할 노래하며 때까지 구하지 그러므로 것이다. 인생에 일월과 대한 공자는 바이며, 인간은 살았으며, 풀밭에 맺어, 끓는다. 귀는 트고, 그들의 같으며, 그들의 투명하되 사는가 말이다. 꽃이 길을 끓는 크고 무한한 황금시대다. 기관과 아름답고 그들의 있는 어디 속에서 영락과 보이는 못할 피다. 청춘이 황금시대의 청춘의 어디 교향악이다. aside2 footer * { margin: o; padding..

더보기 중고거래 동네가게 알바 부동산 직거래 채팅하기 당신 근처의 당근마켓 중고 거래부터 동네 정보까지, 이웃과 함께해 가깝고 따뜻한 당신의 근처를 만들어요. 우리 동네 중고 직거래 마켓 동네 주민들과 가깝고 따뜻한 거래를 지금 경험해보세요. 인기매물 보기 믿을 수 있는 중고거래 중고거래 동네가게 당근알바 당근비즈니스 채팅하기 자주 묻는 질문 회사 소개 인재 채용 당근마켓 앱 다운로드 App Store App Store * { margin: 0; padding: 0; box-sizing: border-box; } header { width: 100vw; background: white; height: 60px; padding: 15px; display: flex; justify-content: space..

1. 시맨틱 태그(semantic) 기능 있음 - h1, a, img 기능 없음 - div, span header : 머리말 (로고 - 네비()) section : 페이지 구분 asdie : 사이드바 article : 본문 내용 footer : 바닥글 - 회사 카피라이트 1 2 3 * { margin: 0; padding: 0; } .container div { border: 1px solid black; width: 200px; height: 200px; background-color: skyblue; display: inline-block; margin-right: -6px; font-size: 16px; } .container { font-size: 0; }

.container { border: 2px solid red; height: 500px; display: flex; /* justify-content: center; */ /* justify-content: flex-end; */ /* justify-content: flex-start; */ } /* .container div { border: 1px solid black; background: skyblue; height: 50px; width: 100px; } */ .box1 { border: 1px solid black; background: skyblue; height: 100px; width: 100px; } .box2 { border: 1px solid black; background: sk..