FRONT-END11 [CSS] input 박스 클릭-> 연결되어있는 글자색 변경 // 체크박스 체크-> 글씨보이게 하기 1.과제 : 이렇게 로그인 페이지를 만들고 이메일 인풋박스를 클릭하면 위에 연결되어있는 이메일의 색상을 변경하는 것시도해본 방법 이메일 has가 기억이 나서 input에 span을 가지고 있는 input을 찾아서 색상변경을 생각했지만 저러면 span이 아닌 결국 input박스가 색상이 변경되어서실패. 그리고 has는 포함하는 구조에서 사용가능하지만 위에 코드는 input이 글자요소를 포함하고 있지 않기때문에 사용 불가능 수식 엉망임. 지피티의 살짝의 도움을 받아서 한 번 고쳐보았음. has는 부모자식처럼 포함관계에 사용가능 이라는 말을 듣고 이메일 .box가 input을 포함하고 있고, 그 input이 포커스 된 상태일 때 .box의 텍스트 색상이 바뀌는 것!하지만.. 2025. 9. 15. [CSS] 0915 3일차 (선택자, hover 등등) CSS (Cascading Style Sheets)는 HTML요소에 스타일 (크기, 색상 등)을 적용하기 위해 사용한다. 적용 방법 CSS를 적용하는 방법은 몇 가지가 있는데 다음과 같다.스타일 태그 활용HTML 문서에 있는 head태그의 자식이 될 수 있도록 style태그를 만들어 해당 태그의 내부 내용에 CSS문법을 작성하는 방법을 의미한다.HTML문서 내에 HTML문법과 CSS 문법이 공존하게 됨으로 원하는 코드를 찾기 힘들어지고 유지보수가 까다로워진다.스타일 속성 활용스타일을 적용하고자 하는 태그에 style 속성을 부여하는 방법을 의미한다.요서에 직접 값을 부여함으로 별도의 선택자를 작성하지 않는다.HTML 문서 내에 HTML 문법과 CSS 문법이 공존하게 됨으로 원하는 코드를 찾기 힘들.. 2025. 9. 15. [HTML]0915 수업 3일차(button,textarea,header,footer 등) button button 태그는 사용자와 주로 클릭과 관려된 상호작용을 위한 태그이다.( input 태그랑 다른 점 자식을 가질 수 없음) 버튼태그 안에는 이미지를 넣을 수있음 버튼 이미지 근데 인풋태그는 이미지 삽입 불가.스스로 닫는 태그 x속성disabled : 비활성화 할 것인가에 대한 속성. 속성 값을 가지지 않음.type : 해당 버튼 태그의 종류를 지정한다.button : 별다른 특성이 없는 일반 버튼.reset : 속해있는 양식 태그가 가지고 있는 입력 태그들의 값을 초기화하는 버튼submit : 속해있는 양식 태그를 제출하기 위한 버튼버튼 버튼 textarea textarea태그는 개행이 가능한 문자열을 입력 받기 위해 사용한다.(게시글, 댓글에 이용 왜냐면 여러 줄 작성이 가능하기 때문.. 2025. 9. 15. [HTML]0912 수업 2일차(table,form,label.input,select - option,optgroup) HTML로 표 만들기 table(table) 태그는 표를 만들기 위한 태그이다.스스로 닫는 태그 x데이터를 담고 시각화하기 위한 목적으로만 사용하여야 하며, 사이트의 레이아웃이나 디자인 목적으로 사용하여서는 안 된다. thead(table head) 태그는 테이블의 데이터에 대한 열(column)을 가지기 위해 사용한다.스스로 닫느 태그 x실질적인 데이터를 담지 않는 것이 좋다.table 태그의 자식이어야 하며 한 게 이하만 사용되어야 한다. tbody(table body)태그는 테이블의 실질적인 데이터를 담기위해 사용한다.스스로 닫는 태그 xtable태그의 자식이어야 햐며 한 개 이하만 사용되어야 한다. tfoot(table foot)태그는 테이블이 가지고 있는 데이터의 통계나 정리, 필터링을.. 2025. 9. 12. [HTML]0911 수업 1일차 태그 안에 자식 태그의 관계(css가기전에 제대로 알기)-선조 : 기존 태그의 한단계 이상 상위태그들을 의미한다(부모도 선조에 포함)-부모: 기준 태그의 한 단계 상위 태그를 의미한다. (부모는 꼭 한 개)-자식 : 기준 태그의 한단계 하위태그들을 의미한다. head , body ( 자식은 여러개 일수 있음)-손자 : 기준 태그의 한 단계 이상(한 단계도 포함) 하위 태그들을 의미한다.-형제 : 기준 태그와 동일한 부모를 가지고, 보다 후행(뒷자리)되는 모든 태그들을 의미한다.-인접형제 : 기준 태그와 동일한 부모를 가지고. 바로 뒤에 후행하는 태그들을 의미한다.속성(html태그는 속성attribute를 가질수 있다)생김새 : , html언어에서 속성 값으로 작성하는 모든 값은 문자열임에 유의 .. 2025. 9. 12. 이전 1 2 다음