게시글
질문&답변
안녕하세요? 선생님~!!! 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
- 271
고민있어요
안녕하세요? 선생님 다음과 같은 방법으로 hexagon 만들면 더 좋지않을까요?
- 1
- 1
- 226
스터디
모집완료
자바스크립트 김영보 쌤 강의 4개 비기너, 중고급, ES6+ 기본, 심화 완강
- 4
- 3
- 372
질문&답변
자바스크립트 초보
visual studio 를 설치하여 거기서 실행해보시면 좋을 것 같습니다.
- 0
- 1
- 309
질문&답변
[코딩 시간] 코드 확인해주세요~~
누적값이니까 다음과 같이 해야하지않을까요?>., '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
- 223
질문&답변
선생님 안녕하세요? 코딩해봤습니다.
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
- 238
질문&답변
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
- 385
질문&답변
언어변경
안녕하세요? 네이버에서 다음과 같이 검색하니 일러스트 영문 블러그에 설명이 파일 이름을 수정하시면 된다고합니다. ^^
- 1
- 1
- 250
블로그
전체 42021. 06. 26.
0
자바스크립트 한달내 김영보 쌤 4개 완강을 위한 공부
자바스크립트의 특징 1.스크립팅 언어, 소스파일 코드를 사용 시점에 컴파일! 소스파일 위에서부터 아래로 컴파일하며 2.함수 구문을 만났을때 블록을컴파일하지않음, 함수를 직접 호출했을경우에 그때 블록 컴파일 3.객체지향프로그래밍 메소드 호출방법 데이터,오브젝트,인스턴스 메소드를 알수없을때 MDN 활용. 디스크립터란? 프로퍼티의 속성이름과 속성값 정의
2021. 06. 26.
0
자바스크립트<김영보쌤 강의 4개 한달 완강>-3일차 3회차(2021.06.28) 카카오톡 오픈채팅
스터디 참여자 총 4명 중 2명 참여입니다. 스터디원 : 위영민(youngminieo1005@gmail.com) 헐크잡스, youngsu gil 리더 : 헐레벌떡김경미 오늘 스터디 참여자 위영민, 김경미 스터디 주요 규칙 스터디 진행 기간(-7.24) 스터디 진행 방법 : 김영보 쌤 자바스터디 비기너,중고급,기본, 심화 강의 한달안에 다듣고 매일 공부한 내용을 인프런 블로그에 올리고 카톡 오픈톡에 인증샷을 올린다. 스터디 내용 각자 본인의 일일 분량을 정해서 자유롭게 공부하고 인증샷을 카톡으로 보냈다. 스터디에서 나왔던 질문과 답변 팀원 개인이 자유롭게 공부량을 정해서 공부하고 인증하는 것이라 진도에 차이가 있습니다.다음과 같은 질문이 나왔습니다. 위영민 스터디원은 오늘 결제하여 처음으로 강의를 들은 상태고 빠른 시일 내 같이 진도를 맞출정도로 열심히 공부하기로 했습니다. 김경미는 김영보쌤 비기너 강좌 3-4번 정도 들은 상태 1.JSON(javascript Object Notation) 표기 방식이란? 클라이언트와 서버 간의 http 통신을 위한 텍스트 데이터 포맷 2.Json은 자바스크립트의 리터럴과 유사하게 키와 값으로 구성된 순수한 텍스트! 큰따옴표로 묶어야하는이유? 키는 반드시 큰따옴표로 묶여야 한다.규약이므로. 3.JSON.stringify 메서드는 객체를 JSON 포맷의 문자열로 변환하며 이를 직렬화한다.
2021. 06. 21.
0
자바스크립트<김영보쌤 강의 4개 한달 완강>-1일차
1회차(2021.06.24) 카카오톡 오픈채팅 스터디 참여자 총 4명 중 2명 참여입니다. 스터디원 : 위영민(youngminieo1005@gmail.com) 헐크잡스, youngsu gil 리더 : 헐레벌떡김경미 오늘 스터디 참여자 위영민, 김경미 스터디 주요 규칙 스터디 진행 기간(-7.24) 스터디 진행 방법 : 김영보 쌤 자바스터디 비기너,중고급,기본, 심화 강의 한달안에 다듣고 매일 공부한 내용을 인프런 블로그에 올리고 카톡 오픈톡에 인증샷을 올린다. 스터디 내용 각자 본인의 일일 분량을 정해서 자유롭게 공부하고 인증샷을 카톡으로 보냈다. 스터디에서 나왔던 질문과 답변 오늘은 첫 모임으로 스터디 규칙을 나누는 워밍업 시간이었습니다.
2021. 06. 18.
0
자바스크립트와 친해주시기 위한 블로그!
비기너는 다 들었는데 아직도 자바스크립트 너무 생소하다. ES6+ 심화까지 다듣고 여러 번 들으면 자바스크립트와 친해지려나... 프론트엔드 개발자 꼭 되고싶다!