게시글
고민있어요
아직 강의보기전인데
- 1
- 1
- 210
질문&답변
넷플릭스 반응형부분에서 막혔습니다.
(사진)
- 1
- 7
- 408
질문&답변
넷플릭스 반응형부분에서 막혔습니다.
@media (max-width: 768px) { body { font-size: 16px; } .logo img { width: 140px; } header { padding: 35px 25px; } /* common css */ section { padding: 20px; } /* section : selcome */ .welcome { height: 100vh; } /* heading */ .heading { width: 100%; } .heading h1 { font-size: 34px; } /* getstarted */ .getstarted { width: 90%; } .getstarted input[type=email] { width: 100%; margin-bottom: 15px; } /* section : enjoy, download, watch, create */ .enjoy, .download, .watch, .create { height: auto; position: static; transform: translate(0); } .inner { width: 100%; position: static; transform: translate(0); } /* change order */ .download .inner, .create .inner { border: 10px solid red; display: flex; flex-direction: column; } .download .inner .desc, .create .inner .desc, { order: 1; } /* 수정 */ .inner > div { float: left; width: 50%; } .desc h2 { font-size: 26px; } /* 수정 */ .download .inner .preview .create .inner .preview { order: 2; } .desc, .preview { float: none; width: 100%; text-align: center; } .preview img { width: 100%; height: auto; } desc h2 { font-size: 30px; } /* section: faq */ .faq { padding: 80px 20px; } .faqinner { width: 100%; } .faqinner h1 { font-size: 30px; line-height: 1.2em; } /* footer */ .footer-inner { width: 100%; } .items { width: 48%; margin-bottom: 20px; } /* modal */ .login { width: 100%; } }
- 1
- 7
- 408
질문&답변
넷플릭스 반응형부분에서 막혔습니다.
반응형css @media (max-width: 768px) { body { font-size: 16px; } .logo img { width: 140px; } header { padding: 35px 25px; } /* common css */ section { padding: 20px; } /* section : selcome */ .welcome { height: 100vh; } /* heading */ .heading { width: 100%; } .heading h1 { font-size: 34px; } /* getstarted */ .getstarted { width: 90%; } .getstarted input[type=email] { width: 100%; margin-bottom: 15px; } /* section : enjoy, download, watch, create */ .enjoy, .download, .watch, .create { height: auto; position: static; transform: translate(0); } .inner { width: 100%; position: static; transform: translate(0); } /* change order */ .download .inner, .create .inner { border: 10px solid red; display: flex; flex-direction: column; } .download .inner .desc, .create .inner .desc, { order: 1; } .download .inner .preview .create .inner .preview { order: 2; } .desc, .preview { float: none; width: 100%; text-align: center; } .preview img { width: 100%; height: auto; } desc h2 { font-size: 30px; } /* section: faq */ .faq { padding: 80px 20px; } .faqinner { width: 100%; } .faqinner h1 { font-size: 30px; line-height: 1.2em; } /* footer */ .footer-inner { width: 100%; } .items { width: 48%; margin-bottom: 20px; } /* modal */ .login { width: 100%; } }
- 1
- 7
- 408
질문&답변
넷플릭스 반응형부분에서 막혔습니다.
/* Google Web Font */ @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap'); /* font-family: 'Roboto', sans-serif; */ /* XEION CDN */ @import url('http://cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css'); * { box-sizing: border-box; font-family: 'Roboto', sans-serif; } body { background-color: #000; color: white; margin: 0; line-height: 1.6em; font-size: 26px; } a { text-decoration: none; color: white; } section { border-bottom: 10px solid gray; position: relative; } /* ///////// header ///////////// */ header { overflow: hidden; padding: 40px 50px; position: absolute; width: 100%; z-index: 10; } .logo { float: left; } .logo img { width: 170px; } .signin { float: right; } .signin button { background-color: crimson; border: none; color: white; padding: 7px 16px; border-radius: 5px; text-transform: capitalize; cursor: pointer; font-size: 18px; } /* //////////// section : welcome /////////// */ .welcome { height: 80vh; background: url(images/bg.jpg) no-repeat center center; position: relative; background-size: cover; } .welcome::before { content: ''; position: absolute; background-color: rgba(0, 0, 0, 0.7); width: 100%; height: 100%; left: 0; top: 0; } /* heading */ .heading { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 800px; } .heading h1 { font-size: 64px; line-height: 1.2em; margin: 0; } .heading h5 { font-weight: normal; margin: 0; font-size: 20px; } .heading p { font-size: 20px; } .getstarted { position: relative; display: inline-block; } .getstarted input[type=email], .getstarted button { height: 60px; border: none; outline: none; vertical-align: middle; } .getstarted input[type=email] { width: 450px; font-size: 18px; padding-left: 10px; } .getstarted input[type=email] + span { color: #999; font-size: 16px; position: absolute; left: 10px; top: 10px; transition: 0.3s; pointer-events: none; } .getstarted input[type=email]:focus + span { transform: translateY(-18px); font-weight: bold; } .getstarted button { width: 220px; margin-left: -6px; cursor: pointer; color: white; font-size: 26px; background: crimson; } /* /////////// section : enjoy, download, watch, create ///////////// */ .enjoy, .download, .watch, .create { height: 500px; } .inner { width: 1150px; margin: auto; overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .inner > div { float: left; width: 50%; } .desc { padding-top: 40px; width: 60% } .desc h2 { font-size: 50px; } .preview { text-align: center; width: 40%; } .preview img { height: 350px; } /* ////////////// faq /////////////// */ .faq { padding: 80px 0; } .faqinner { width: 850px; margin: auto; } .faqinner h1 { text-align: center; font-size: 50px; } input[name=faq-item] { display: none; } input[name=faq-item] + label { display: block; background: #303030; padding: 15px; cursor: pointer; } .faq-content { background-color: #303030; padding: 15px; margin-bottom: 10px; margin-top: 5px; max-height: 0; overflow: hidden; padding: 0; transition: max-height 0.5s; } /* checked fuction */ input[name=faq-item]:checked + label + .faq-content { max-height: 400px; padding: 15px; } input[name=faq-item] + label span { float: right; margin-top: 2px; transform: rotate(45deg); transition: 0.3s; } input[name=faq-item]:checked + label span { transform: rotate(0deg); } aside { text-align: center; } /* ////////// footer ///////////// */ footer { padding: 50px 0; font-size: 14px; color: #777; line-height: 1.4em; } .footer-inner { width: 850px; margin: auto; } .sitemap { border-bottom: 1px solid rgb(68, 68, 68); padding-bottom: 20px; } .sitemap h6 { font-size: 16px; margin: 0; padding-bottom: 50px; } .items { display: inline-block; margin-right: 50px; vertical-align: top; } .items a { color: #777; display: block; line-height: 2em; } .items a:hover { text-decoration: underline; } /* /////////// modal //////////// */ .modal-login { background-color: rgba(0, 0, 0, 0.4); position: fixed; width: 100%; height: 100vh; top: 0; left: 0; z-index: 100; display: none; } .login { width: 450px; height: 500px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: rgba(0, 0, 0, 0.8); font-size: 15px; color: #777; padding: 30px; font-weight: 300; } .login h1 { font-size: 30px; color: white; } .login input[type=text], .login input[type=password] { background-color: #333; padding: 20px 15px; border-radius: 5px; width: 100%; border: none; outline: none; margin-bottom: 3px; color: white; } .login input[type=button] { font-size: 16px;background-color: crimson; color: white; border: none; outline: none; border-radius: 5px; padding: 13px; width: 100%; margin-top: 5px; cursor: pointer; } .login p a { color: royalblue; } .save-info { overflow: hidden; margin-top: 10px; } .save-info label { float: left; } .save-info a { float: right; } .login a:hover { text-decoration: underline; } .btn-close { font-size: 40px; cursor: pointer; position: absolute; right: 20px; top: 20px; }
- 1
- 7
- 408
질문&답변
넷플릭스 반응형부분에서 막혔습니다.
Netflix (사진) Sign in Unlimited movies, TV shows, and more. Watch anywhere. Cancel anytime. Ready to watch? Enter your email to create or restart your membership. Email Address Get Started Enjoy on your TV. Watch on Smart TVs, Playstation, Xbox, Chromecast, Apple TV, Blu-ray players, and more. (사진) (사진) Download your shows to watch offline. Save your favorites easily and always have something to watch. Watch everywhere. Stream unlimited movies and TV shows on your phone, tablet, laptop, and TV without paying more. (사진) (사진) Create profiles for kids. Send kids on adventures with their favorite characters in a space made just for them—free with your membership. Frequently Asked Questions What is Netflix? Netflix is a streaming service that offers a wide variety of award-winning TV shows, movies, anime, documentaries, and more on thousands of internet-connected devices. You can watch as much as you want, whenever you want without a single commercial – all for one low monthly price. There's always something new to discover and new TV shows and movies are added every week! How much does Netflix cost? Watch Netflix on your smartphone, tablet, Smart TV, laptop, or streaming device, all for one fixed monthly fee. Plans range from KRW9,500 to KRW14,500 a month. No extra costs, no contracts. Where can I watch? Watch anywhere, anytime, on an unlimited number of devices. Sign in with your Netflix account to watch instantly on the web at netflix.com from your personal computer or on any internet-connected device that offers the Netflix app, including smart TVs, smartphones, tablets, streaming media players and game consoles. You can also download your favorite shows with the iOS, Android, or Windows 10 app. Use downloads to watch while you're on the go and without an internet connection. Take Netflix with you anywhere. How do I cancel? Netflix is flexible. There are no pesky contracts and no commitments. You can easily cancel your account online in two clicks. There are no cancellation fees – start or stop your account anytime. What can I watch on Netflix? Netflix has an extensive library of feature films, documentaries, TV shows, anime, award-winning Netflix originals, and more. Watch as much as you want, anytime you want. Is Netflix good for kids? The Netflix Kids experience is included in your membership to give parents control while kids enjoy family-friendly TV shows and movies in their own space. Kids profiles come with PIN-protected parental controls that let you restrict the maturity rating of content kids can watch and block specific titles you don’t want kids to see. Ready to watch? Enter your email to create or restart your membership. Email Address Get Started Questions? Call 00-308-321-0161 FAQ Investor Relation Privacy Speed Test Help Center Jobs Cookie Preferences Legal Notices Account Ways to Watch Corporate Information Netflix Originals Media Center Terms of Use Contact Us Netflix South Korea Netflix Services Korea Ltd. E-Commerce Registration Number: Je 2018-Seoul Jong-ro-0426 Ho. Phone: 00-308-321-0161 Representative: Reginald Shawn Thompson Email: korea@netflix.com Address: 20F, Tower A, Centropolis Building 26, Ujeongguk-ro, Jongno-gu, Seoul, 03161 Republic of Korea Business registration number: 165-87-00119 Hosted by: Amazon Web Services Inc. KFTC website Login Remember me Need help? New to Netflix? Sign up now. This page is protected by Google reCAPTCHA to ensure you're not a bot. Learn more. $('.btn-open').click(function(){ $('.modal-login').fadeIn(); }) $('.btn-close').click(function(){ $('.modal-login').fadeOut(); })
- 1
- 7
- 408
질문&답변
docker와 kubeadm 설치 강의가 플레이가 안됩니다.
저만 그런거 아니네요ㅠㅠㅠㅠㅠㅠ 타 강의 듣는데 강의 재생이 안되네요
- 0
- 2
- 195
질문&답변
질문 두개 드립니다!
친절한 답변 감사드립니다!!!!!!!!!!
- 1
- 5
- 250
질문&답변
질문 두개 드립니다!
/* google web font */ @import url('https://fonts.googleapis.com/css2?family=Yanone+Kaffeesatz:wght@300;400&display=swap'); /* reset css */ body { margin: 0; background-color: #eee; display: flex; justify-content: center; align-items: center; height: 100vh; text-align: center; font-family: 'Yanone Kaffeesatz', sans-serif; font-size: 1.4em; } a { text-decoration: none; color: black; } /* css start */ .frame { width: 450px; } .frame h1 { margin: 0; } .frame p { line-height: 1.5em; } .frame p, .btns, .links { color: rgb(119, 119, 119); } .btn { width: 200px; box-sizing: border-box; padding: 10px 16px; border-radius: 4px; display: inline-block; margin-bottom: 20px; margin: 0 5px 20px; } .download { background-color: #fff; box-shadow: 0 2px rgb(158, 158, 158); } .check { background-color: #45a7fd; box-shadow: 0 2px #2183da; color: white; } .btn i { margin-right: 6px; } .links { font-size: 12px; } .link { color: #45a7fd; } .link:hover { text-decoration: underline; } .link:hover:before { text-decoration: none; } .link, span { margin: 0 10px; } .link:before { content: '·'; margin-right: 16px; color: rgb(119, 119, 119); text-decoration: none; }
- 1
- 5
- 250
질문&답변
질문 두개 드립니다!
2. 링크에 호버하면 before로 준 점 text decoration underline 사라지는법도 궁금합니다. 제가 해봤을땐 안돼가지구요,, (사진) 폰트어썸 섹션 UI Icons. Easy. Done Get vector icons and social logos on youre websidte with Font Awesome, the web's most popular icon set and toolkit. Download Free Checkout Pro Version5.0.8 946 Free Icons 1,535 Pro Icons Old 4.7.0 Docs
- 1
- 5
- 250