소개
게시글
질문&답변
안녕하세요? 선생님~!!! hexagon 이렇게 만들면 어떻겠습니까?
안녕하세요? 선생님 ^-^ !!! html 은 선생님 파일 그대로 사용했습니다! CSS 만 수정하였습니다. 1. index.html Document Photographer As in other arts, the definitions of amateur and professional are not entirely categorical. (사진) Musician A composer is a musician who creates musical compositions. (사진) Sculptor Sculpture is the branch of the visual arts that operates in three dimensions. (사진) 2. style.css @import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,500,700,900&display=swap'); /* Fontawesome 4.7 */ @import url('https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); /* XEION CDN */ @import url('http://cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css'); * { box-sizing: border-box; } body { font-family: 'Noto Sans KR', sans-serif; font-weight: 300; color:#333; margin: 0; display: flex; justify-content: center; align-items: center; height: 100vh; } a { text-decoration: none; color: #333; } h1,h2,h3,h4,h5 { font-weight: 500; margin-top: 0; } .frame { display: flex; gap:40px; } .hexagon { width: 400px; height: 450px; position: relative; } .shape { border: 3px solid orange; clip-path: polygon(49% 0, 100% 24%, 100% 74%, 48% 100%, 0 73%, 0 23%); width: inherit; height: inherit; position: absolute; transition: 0.3s; overflow: hidden; } .shape img { width: inherit; height: inherit; object-fit: cover; object-position: right; } .hexagon .caption { position: absolute; width: inherit; height: inherit; color: #fff; display: flex; justify-content: center; align-items: center; text-align: center; transform: translateY(20px); transition: 0.3s; opacity: 0; } .hexagon:hover .caption { transform: translateY(0); opacity: 1; } .caption h2 { font-size: 2em; } .hexagon:nth-child(1) .caption { background: linear-gradient(to top, crimson, transparent); } .hexagon:nth-child(2) .caption { background: linear-gradient(to top, royalblue, transparent); } .hexagon:nth-child(3) .caption { background: linear-gradient(to top, yellowgreen, transparent); } .hexagon:hover .shape{ transform: translateY(-60px); } .hexagon:before { content: ''; position: absolute; width: 100%; height: 60px; background: radial-gradient(rgba(0, 0, 0, 0.3), transparent, transparent); bottom: -70px; transition: 0.5s; } .hexagon:hover:before { opacity: 0.6; transform: scale(0.8); bottom: -70px; }
- 1
- 2
- 237
고민있어요
안녕하세요? 선생님 다음과 같은 방법으로 hexagon 만들면 더 좋지않을까요?
- 1
- 1
- 154
스터디
모집완료
자바스크립트 김영보 쌤 강의 4개 비기너, 중고급, ES6+ 기본, 심화 완강
- 4
- 3
- 237
질문&답변
자바스크립트 초보
visual studio 를 설치하여 거기서 실행해보시면 좋을 것 같습니다.
- 0
- 1
- 270
질문&답변
[코딩 시간] 코드 확인해주세요~~
누적값이니까 다음과 같이 해야하지않을까요?>., 'use strict' var j=0,k=0,sum=0; for(var i=1; i 51; i++){ (i-1)%2===0?j+=i:k+=i } console.log(j,k,sum=j+k);
- 1
- 2
- 170
질문&답변
선생님 안녕하세요? 코딩해봤습니다.
document.write를 쓰면 안되는지 몰랐습니다. 수정하겠습니다. 그리고 for문 중괄호 묶음을 다음과 같이 수정하였습니다. 확인부탁드립니다. 감사합니다. var odd=0; var even=0; var num=0; for(i=1 ; i 51 ; i++){ if((i-1)%2===0){ odd=odd+i; }else{ even=even+i; }}; console.log("홀수합"+odd); console.log("짝수합"+even); console.log("총합"+(num=odd+even));
- 1
- 1
- 192
질문&답변
project 생성문제
3버전을 사용했는데도 동일하게 C:\dev\cocos2d-x-3.17.2>cocos new brickBreaker -p com.creapple.brickbreaker -l js Fatal: can't find any template for language. You can specify the path of cocos2d-js by argument '-e'. 라고 cmd 창에 나옵니다. 어떻게해야하나요?
- 0
- 5
- 291
질문&답변
언어변경
안녕하세요? 네이버에서 다음과 같이 검색하니 일러스트 영문 블러그에 설명이 파일 이름을 수정하시면 된다고합니다. ^^
- 1
- 1
- 196