팀 작업이 중간에 다다랐다. 뭔가 한건 많은 것 같은데 막상 까보면 별거 없는 기분이라 조금은 허무하기도 하다.
꽤 .. 귀여울지도?
오늘은 scss를 활용하여 @each와 @if를 사용해보았다.
이미지를 넣기 위해... 해봤는데 css 코드 몇 줄 줄이자고 이걸 꼭 써야하나 하는 생각이 사라지지 않는다 ㅋㅋㅋ
$mainImgName : 'activity' 'cafe' 'food' 'tourist' 'emergency';
@each $el in $mainImgName {
$idx : index($mainImgName, $el);
&:nth-child(#{$idx}) .parts__image {
$path : '../source/' + $el + 'Main.jpeg';
background-image: url($path);
@if ($idx == 1) {
background-position: 0 -40px;
} @else if ($idx == 2) {
background-position: 0 -60px;
}
}
}
일단은 이렇게 읽어와봤다.. 하드코딩을 줄이고 싶은데 머리 아프다~
그래도 얼추 틀이 점점 잡혀가고 있어서 완성된 홈페이지를 보고 싶다!
'학원에서 배운 것 > JavaScript' 카테고리의 다른 글
[포스코 x 코딩온] 팀프로젝트 추가 기능(스티커?..) (0) | 2023.03.04 |
---|---|
내가 맡은 페이지는 거의다 끝냈다. (0) | 2023.03.03 |
Fontawesome 과 OpenWeatherMap 사용기 + 가상 클래스 선택자는 js로 접근이 어렵다 (0) | 2023.02.28 |
KDT 5th 웹개발자 입문 수업 21일차 - 2 (0) | 2023.02.23 |
KDT 5th 웹개발자 입문 수업 20일차 - 3 (0) | 2023.02.22 |