[HTML/CSS] CSS로 대각선 그리기
[HTML/CSS] CSS로 대각선 그리기 컴포넌트를 구현하던 중 div에 대각선을 그려야 하는 작업이 필요했습니다. 어떠한 방법으로 그릴 수 있을까요? 간단하게 생각해보면 아래와 같은 방법들이 있습니다. 1. 직선을 그린 후 rotate를 이용한다. (구현 X) 2. background로 svg를 이용한다. (기존에 사용하던 방식) 3. background-gradient를 이용한다. (이번에 새로 알게됨) 위 순서대로 대각선 그리는 방법을 알아보겠습니다. ◆ 직선을 그린 후 rotate를 이용한다. 이 방법은 대각선의 길이를 먼저 계산해야합니다. 대각선 길이는 width, height을 알 수 있기 때문에 피타고라스 정리로 구할 수 있습니다. 그러나 문제는 끼인 각입니다. 정사각형의 경우 대각선과 x..
