CSS Media Query(미디어 쿼리) 미디어 쿼리는 미디어 타입(media type)과 적어도 하나 이상의 표현식(expression)으로 구성된다. 표현식은 width, height, color와 같은 미디어 특성(media feature)을 이용해 그 특성들의 상태에 따라 다른 스타일을 적용할 수 있다. 미디어 쿼리는 CSS3에 포함되어 있으며, 주로 화면의 크기에 따라 스타일을 달리하는 방법을 사용한다. 미디어 쿼리는 다음 두 가지 방법으로 사용할 수 있다. 요소 link 요소에 사용하여 특성이 조건에 맞을 때 css 파일을 불러온다. CSS 스타일 적용 css 파일 내에서 @media 키워드로 시작하고 그 뒤에 조건을 붙여 사용한다. 조건이 맞으면 대괄호 안의 스타일이 적용된다. @media..
text-decoration 텍스트에 장식을 추가한다. text-decoration-line, text-decoration-style, text-decoration-color, text-decoration-thickness 의 단축속성 특징 text-decoration은 모든 자식 텍스트 요소에 걸쳐서 적용된다. 따라서, 자식 요소에서는 부모가 적용한 데코레이션을 제거할 수 없다. 초기값 text-decoration-color: currentcolor text-decoration-style: solid text-decoration-line: none 속성값 color 선의 색상을 지정하여 사용한다. style solid 한 줄을 그린다. double 이중선을 그린다. dotted 점선을 그린다. dash..
✍🏻 programmers의 AI서비스와 함께 누구나 만드는 웹 프로젝트! feat. ChatGPT 강의를 바탕으로 작성된 코드입니다. 목표 기본 소스코드에서 버튼의 이벤트 리스너를 등록해 특정 동작을 수행하는 코드를 작성합니다. 우선, 우리가 원하는 해당 버튼의 결과는 다음과 같습니다. "이미지 만들기" 버튼을 클릭하면, 이미지를 보여준다. 30개의 이미지가 생성되면, 경고창이 표시된다. 사용자의 응답에 따라 새로운 이미지가 생성되지 않거나, 생성된 30개의 이미지가 화면에서 삭제된다. 이미지 가져오기 버튼 클릭 시 이미지를 가져오는 코드는 다음 로직대로 실행됩니다. 이벤트 대상을 선택한다. 여기서 이벤트 대상은 "이미지 만들기" 버튼입니다. html 파일에 있는 해당 button의 요소를 JavaSc..