[웹개발종합반] 2주차 J-Query 연습하기
forEach 구문을 이용해 J-Query 로 반복문 작성 function checkResult() { let people = [ { name: "서영", age: 24 }, { name: "현아", age: 30 }, { name: "영환", age: 12 }, { name: "서연", age: 15 }, { name: "지용", age: 18 }, { name: "예지", age: 36 }, ]; $("#q2").empty(); people.forEach((a) => { let temp_html2 = `${a.name}은 ${a.age} 살 입니다.`; $("#q2").append(temp_html2); }); } 점 표기법으로 요소노드 추가했으나 $("#q2").empty(); people.forE..
[CSS] 그림자: box-shadow
box-shadow: 박스에 그림자를 나타내는 기능으로 다음과 같이 작성될 수 있음. box-shadow: 5px 10px 15px 8px rgba(0, 0, 0, 0.6); /* 가로: 5px 세로: 10px 흐린 정도(Blur): 15px 퍼지는 정도(Spread): 8px 색상: rgba(0, 0, 0, 0.6) */ box-shadow: 10px 15px 20px 5px rgba(0, 0, 0, 0.4); /* 가로, 세로, 블러, 그림자가 퍼지는 크기, 그림자 색상*/ 유용한 사이트 https://cssgenerator.org/box-shadow-css-generator.html
[CSS] 그라디언트: linear-gradient
linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)); 그라데이션을 나타낼 수 있는 속성으로 보통 배경이미지에 많이 사용된다. 특정 각도를 입력하여 각도에 맞게 그라데이션이 나타나도록 할 수 있음. 내가 만든 웹사이트에서도 이 속성이 사용되었는데, .wrap{background: linear-gradient(to right bottom,#0f0f0f,#282828);} 오른쪽 아래 방향 ↘️ 으로 그라데이션이 가게끔 작성했음. 다음처럼 그라데이션기능과 이미지를 같이 넣어 디자인 효과를 줄 수도 있다. background-image: linear-gradient(90deg, rgba(0, 0, 0, 1) 40%, rgba(0, 0, 0, 0)), url("pizza.png");..
