어제 오늘 내일

지난번 포스팅에서 배경 그라데이션, 무지개 그라데이션을 적용하는 방법을 알아보았습니다. [HTML/CSS] 배경색 그라데이션 넣기 (linear-gradient()) [HTML/CSS] 배경색 그라데이션 넣기 (linear-gradient()) 지난번에는 단순하게 요소의 배경색을 지정하거나, 배경 이미지를 지정하는 방법을 알아보았습니다. [HTML/CSS] div 안의 배경색 지정하기 div 안의 배경색을 지정하기 위해서는 css의 background-color hianna.tistory.com [HTML/CSS] 무지개 그라데이션 (linear-gradient) [HTML/CSS] 무지개 그라데이션 (linear-gradient) 지난 번 포스팅에서는 CSS로 그라데이션을 만들 수 있는 linear-g..

지난 번에는 CSS의 linear-gradient() 함수를 이용하여 배경색에 그라데이션을 주는 방법을 알아보았습니다. [HTML/CSS] 배경색 그라데이션 넣기 (linear-gradient()) 또한, 이를 활용하여 무지개 색으로 배경을 지정하는 방법도 알아보았습니다. [HTML/CSS] 무지개 그라데이션 (linear-gradient) 이를 응용하면 배경색을 2가지 색으로 반반 나누어 지정하는 것은 더 쉽겠죠? 배경색 두개로 반반 나누어 지정하기 (그라데이션) 배경색 두개로 반반 나누어 지정하기 (Solid) 두 배경색의 경계선 위치 조정하기 (Solid) 1. 배경색 두개로 반반 나누어 지정하기 (그라데이션) my_gradient_half_1.html my_gradient_half_1.css #h..

지난 번 포스팅에서는 CSS로 그라데이션을 만들 수 있는 linear-gradient에 대해서 설명했습니다. [HTML/CSS] 배경색 그라데이션 넣기 (linear-gradient()) 이번에는 linear-gradient를 이용해서 무지개 모양의 그라데이션 배경을 만들어 보겠습니다. 무지개 그라데이션 무지개 그라데이션 (solid) 1. 무지개 그라데이션 my_gradient_rainbow_1.html my_gradient_rainbow_1.css #rainbow { background-image: linear-gradient(to right, red, orange, yellow, green, blue, indigo, purple); width: 500px; height: 300px; } 결과 2. ..

지난번에는 단순하게 요소의 배경색을 지정하거나, 배경 이미지를 지정하는 방법을 알아보았습니다. [HTML/CSS] div 안의 배경색 지정하기 div 안의 배경색을 지정하기 위해서는 css의 background-color 속성을 지정합니다. background-color 예제 div { height : 20px; width : 200px; } CSS에서 색깔을 지정하는 방법은 다음과 같습니다. 이름 16진.. hianna.tistory.com [HTML/CSS] div에 배경 이미지 넣기 총정리 (반복, 한번만, 가운데, 꽉차게) CSS를 사용하여 div에 배경 이미지를 넣는 방법입니다. 배경 이미지 넣기 (background-image) 배경 이미지 반복 횟수 지정하기 (background-repeat..