.main .brand .brand-article { width: 100%; } .main .brand .brand-article .swiper-slide { display: block; /* margin-bottom: 40px; */ } .main .brand .brand-article img { width: 320px; margin: 0 auto; } .main .brand .brand-article .brand-txt { margin-top: 80px; } .main .brand .brand-article .brand-txt strong { font-size: 25px; font-weight: 700; color: tomato; } .main .brand .brand-article .brand-tx..
🔥 부트캠프-웹 개발 🔥/HTML5
Happy Place for Everyone 모두에게 행복한 장소가 되는 곳 Healty 건강한 맛과 행복한 서비스 Lead K-Food Culture 전세계를 감동시킬 우리의 맛과 멋 var swiper1 = new Swiper(".mainVisual", { loop: true, autoplay: { delay: 3000 }, pagination: { el: ".swiper-pagination", }, }); visual 부분은 바닐라스크립트가 아닌 swiper 플러그인을 사용해 구현했다. .main .about-img { height: 160px; background-position: 0 0; background-size: cover; background-image: url(../images/abou..
em rem 모바일 예제 모바일은 컴퓨터 모니터와 해상도가 다르고 세로가 긴 비율이기 때문에 html, css 상에서 크기를 적절하게 변환해줘야 한다. 단순 수치로 작성하게 되면 모바일상에서 제대로 출력되지 않는다. 그래서 사용하는 단위가 em, rem 두 가지이다. 1) em 단위 1 단위 2 단위 3 단위 4 단위 5 1em은 부모를 기준으로 100%가 된다. 따라서 같은 0.8em일 지라도 자식으로 내려가다보면 0.8*0.8*0.8... 이 되어 점점 작아지게 된다. 2) rem test test 단위 1 단위 2 단위 3 단위 4 단위 5 rem은 부모를 기준으로 하는것이 아닌 최상위 html을 기준으로 한다. 따라서 자식으로 내려가도 기준이 달라지지 않는다. 3) 모바일 예제 MainMenu1 ..
본문바로가기 본문바로가기 본문바로가기 홈 로그인 회원가입 고객문의 회사소개 사업분야 연구소 제품소개 화진뉴스 고객문의 인사말 회사소개 인사말 연혁&비전 수상실적 사업파트너 CI소개 오시는길 지속 가능 경영 CEO 인사말 우리가 사는 공동체를 위해, 건강하고 안전한 바른 먹거리 창출을 위해 노력합니다 (주)BC 대표이사 비코딩 안녕하십니까! BC 대표이사 비코딩입니다. BC는 앞선 기술과 품질, 서비스 창출로 우리가 사는 공동체의 행복에 기여하는 냉동 가공식품 및 식자재 유통 전문기업입니다. 특히 냉동 치킨 가공품에서는 차별화된 글로벌 인프라를 기반으로 높은 품질과 안정적인 최고의 상품을 제공하고 있습니다. 최근 BC는 급변하는 시대에 맞춰 새로운 미래에 대한 도약으로, B2C로의 제품확장을 본격적으로 진..
form 1-1) form#1 form은 회원가입, 로그인 게시글 등록 등을 위해 사용한다. 회원가입 text password checkbox tel file color date month number submit input type에 입력받고자 하는 형식을 적절하게 찾아 사용하면 된다. 날짜를 사용하면 날짜 형식과 달력이 추가로 나오게 된다. pssword는 기본적으로 작성 내용이 ***처리되어 표시된다. 1-2) form#2 예제1 아이디 size : 입력 박스 크기 설정 maxlength : 최대 입력 글자 수 title : 접근성용 placeholder : 입력 박스에 나타나 있는 안내글 (위의 경우 아이디, 비밀번호 입력에 해당) required : 필수 사항 (입력하지 않으면 submit이 되..
img header nav section main footer article aside ctrl+b alt+l+o ctrl+/ 1) img img-이미지를 불러온다. src 부분에 이미지 파일의 경로를 찾아 넣어야 한다. ./ : 현재 폴더 ../ : 상위 폴더 / : 최상위 폴더 width : 너비 height : 높이 둘 다 px 단위 사용 2) header, nav, section, main, footer header : 사이트 상단 머리 부분 주로 로고, 메뉴, 로그인, 회원가입 등 nav : 중요 메뉴 section : 주제가 동일한 페이지 또는 컨텐츠 영역 ( h1~h6 제목이 반드시 있어야 한다.) main : 실제 컨텐츠 영역 (본문) footer : 하단, 하단 로고, 패밀리 사이트, 정..
h p br ul ol dl div strong em a alt+z alt+shift+ ↓ 1) h h-제목을 입력할때, h1~h6 숫자가 커질수록 폰트는 작아진다. 비코딩 비코딩 2) p, br p-하나의 문단을 만들떄 br-줄바꿈 *br을 남용하는건 좋지 않다고 배웠다. 비코딩 비코딩 비 전공자의 Be develper 비 전공자의 Be develper 3) ul, ol ul-순서가 필요 없는 목록 ol-순서가 필요한 목록 li-목록 내부 항목 *ul안에 ul이 들어갈 수 있다. (ol도 마찬가지) 학교 초등학교 중학교 고등학교 중학교 1학년 2학년 3학년 4) dl, dt, dd dl-정의 목록 dt-정의 용어 dd-정의 설명 중학교 초등학교 졸업 후 진학하는 중등교육기관 고등학교 중학교 과정 다음의..