Stack/CSS

[CSS / SCSS] SCSS로 Style 적용하기 6 (고운세상코스메틱)

https://www.gowoonsesang.com/ 고운세상 코스메틱 고운세상 코스메틱 웹사이트 www.gowoonsesang.com index.html About Us 기업소개 연혁 CEO 메시지 고운세상 글로벌 네트워크 Brands Dr. G 스킨 솔루션 Sustainability 고운실천 윤리경영 News 고운이야기 공지사항 Careers Contact 닫기 KO KO EN 01Gowoonsesang Cosmetics 누구나 피부를 건강하게 우리는 피부 과학으로 세상을 더 건강하고 아름답게 만들고 있습니다. 02Gowoonsesang Cosmetics 함께 성장하는 고운세상 고운세상코스메틱은 누구나 건강한 피부로 행복한 삶을 누리는 세상을 꿈꿉니다. 이러한 뜻을 함께하는 사람들이 모여 도전과 성장..

[CSS / SCSS] SCSS로 Style 적용하기 5 (현대삼호중공업)

index.html 회사소개 사업분야 지속가능경영 미디어센터 동반성장 인재채용 투자자정보 ENG FAMILY SITE 한국조선해양 HHI Group 현대중공업 현대미포조선 동반성장 인재채용 투자자정보 한국조선해양 GREEN TECHNOLOGIES FOR A BETTER FUTURE 현대삼호중공업은 친환경 기술과 스마트 기술을 통해 보다 나은 미래를 준비하고 새로운 도전을 이어가고 있습니다. COMPANY MORE SCROLL DOWN HSHI BUSINESS 현대삼호중공업의 조선, 산업설비, 해양사업분야를 한 눈에 볼 수 있습니다. BUSINESS MORE 자세히 보기 01 Shipbuilding 조선분야 세계 최고의 선박을 만드는 현대삼호중공업은 첨단 설비와 기술로 고객만족을 실현하고 첨단 3차원 설계..

[CSS] CSS 애니메이션

@keyframes scaleWidth { from { width: 100px; } to { width: 200px; } } div { animagion-name: scaleWidth animation-duration: 1s; } ani.html ani_ex.html ani_ex_teacher.html ani_ex2.html Green Academy green web

[CSS / SCSS] SCSS로 Style 적용하기 4 (hotel)

http://hyodev.dothome.co.kr/hotel/ Document A Whole New World I can show you the world. Shining Shimmering Splended.Tell me when you decide let me be in your heart. hyodev.dothome.co.kr index.html logo Hotem Fucility Businiss Restaurant Maldives A Whole New World I can show you the world. Shining Shimmering Splended. Tell me when you decide let me be in your heart. Reservation Suite Surf A Dazzl..

[CSS / SCSS] SCSS로 Style 적용하기 3 (Samsung)

index.html 로고 개인 기업 MY삼성생명 전체상품 라이프& 고객센터 로그인 인증센터 삼성생명 로그인 인증센터 이용등록 나의계약 보험금청구 보험료납입 보홈계약대출 변액펀드변경 분할/만기보험금 IPR가입 종합자산관리 다이렉트보험 소비자포털 컬설팅신청 동의라운지 회사지원 연금가입 국가고객만족도 생명보험부문 1위 고객님의 사랑으로 삼성생명이 2019년 NSCI 생명보험부문 16년 연속 1위를 수상하였습니다. 소소한 일상 속 든든한 보험이야기보험상품 "돈보다 소중한 걸 지키려니 돈이 필요하구나." "매일 같이 등원하는 별이가 세상에서 제일 예쁘데요." "내 안에 살던 예술가가 깨어났어요." "아내가 이제 조신하게 살림하래요." 종기/종신보험 종기/종신보험 연금/저축보험 자녀보험 다이렉트 보험 내 삶을 레밸..

[CSS / SCSS] SCSS로 Style 지정하기 2 (Display)

scss_display.html My Website Lorem ipsum dolor sit amet, consectetur adipiscing elit. link link link link TITLE HEADING Lorem ipsum dolor sit amet image Title text Lorem ipsum dolor sit amet, consectetur adipiscing elit. TITLE HEADING Lorem ipsum dolor sit amet image Title text Lorem ipsum dolor sit amet, consectetur adipiscing elit. About Me images Some text about me in culpa qui officia deseru..

[CSS / SCSS] SCSS로 Style 지정하기 (Isaknox)

style.scss * { margin: 0; padding: 0; box-sizing: border-box; vertical-align: middle; } li { list-style: none; } a { text-decoration: none; color: inherit; } $black_bg: #000; $white_color: #fff; @mixin default-width($wid: 1200px) { width: 100%; max-width: $wid; margin: 0 auto; } @mixin flexlayout($dir: row, $wrap: nowrap, $just: space-between, $align: center) { display:flex; flex-direction: $dir..

[CSS / SCSS] SCSS; CSS Preprocessor / CSS 전처리기

우선 Live Sass Compiler 설치하기 ! 파일 - 기본 설정 - 설정 들어가서 검색창에 live 검색 01scss.scss 01scss.css 02ampersand.scss 03variables.scss 04mixin.scss @mixin large-text { // font-size: 22px; // font-family: sans-serif; // font-weight: bold; font: { size: 22px; family: sans-serif; weight: bold; } &::after { content: "여러분"; } } @mixin dash-line($width: 1px, $color: black) { border: $width dashed $color; } .box { @i..

[CSS] nots (페이지 따라만들기 5)

index2.html BEST SELLER SKINCARE MAKEUP THE STORY EXPERIENCE WHERE PREMIUM DWELLS it is the clean healthy looking skin that bootsts your confidence. NOTs always aim for the premium. Remember the 28 Days 28 Remedy The regeneration cycle of nomal skin Skin Lighting Whitening Program White luminaire which completes beautiful by bringtening the lost light within skin Blue Organic Begin28 Forming moi..

[CSS] CSS 변수 선언

/* 변수 선언 */ :root { --main-bg-color: red; --big-font: 24px; --middle-font: 18px; --small-font: 14px; } /* 변수 사용 */ div { background: var(--main-bg-color); font-size: var(--big-font); } IE는 지원 불가