[JavaScript] 자바스크립트란?, <script> 태그
자바스크립트 - 사용자와 상호작용하는 프로그래밍 언어 - HTML 위에서 동작하며 HTML을 제어하는 언어 - 문장 맨 마지막에 ;(세미콜론) 넣어야 함 - 동적인 언어
- Front-end/JavaScript
- · 2023. 4. 8.
테이블 태그 (table) - 데이터를 포함하는 셀들의 행과 열로 구성된 2차원 테이블 생성할 때 사용 태그 - 테이블 생성 태그 - 테이블에 행 추가 태그 - 테이블에 데이터 추가 - 테이블 행, 열 내에 위치해야 함 Americano Herb tea Strawberry latte 태그 - 테이블의 행과 열에 제목 추가 scope : 제목이 어느 곳에 위치할지 결정하는 속성 제목 : 행의 제목 제목 : 열의 제목 coffee tea latte Americano Herb tea Strawberry latte 태그 - 테이블 데이터를 섹션화 - 테이블이 커져 많은 데이터를 포함할 때 사용 - 데이터를 한 개 이상 포함해야 함 coffee tea latte Americano Herb tea Strawberr..
비디오 태그 (video) - 비디오를 웹 페이지에 포함할 때 사용 - 태그와 달리 닫는 태그 필요 - 여는 태그와 닫는 태그 사이에 적힌 텍스트는 브라우저가 비디오를 로드할 수 없는 경우에만 표시됨 src : 비디오의 위치, 주소 추가하는 속성 controls : 일시 중지, 재생과 같은 기본 비디오 컨트롤을 포함하도록 브라우저에 지시하는 속성 autoplay: 페이지가 로드되자마자 동영상이 자동으로 재생되는 속성 loop: 이 속성을 사용하면 비디오가 계속해서 반복해서 재생되는 속성 비디오를 로드할 수 없습니다. Video not supported
div 태그 - HTML 요소 그룹화하는 데 사용 - 시각적 표현 없음 - 사용자 정의 스타일 적용할 때 유용 This is a heading in a div element This is some text in a div element.
태그 - 사용자의 데이터를 받을 수 있는 대화형 컨트롤 생성 - 자체적으로 닫는 태그 type : 입력받는 데이터 형식 지정. 기본값은 text 더보기 - text : 텍스트 입력 - button : 버튼 - password : 비밀번호 입력. 실제값을 숨기고 *같은 특수문자로 표시 - number : 숫자 입력. step으로 증가 카운트 설정 - range : 범위 값 입력. 최솟값(min)과 최댓값(max) 설정 - checkbox : 체크 박스 생성. value로 값 할당하고 name과 동일한 값 가짐 - radio : 라디오 버튼 생성. 주로 여러 옵션 중 하나를 선택할 때 사용 - submit : 제출 버튼 생성 name : 폼 데이터가 서버에 제출될 때 사용되는 이름 value : 디폴트 글자..
자바스크립트 - 사용자와 상호작용하는 프로그래밍 언어 - HTML 위에서 동작하며 HTML을 제어하는 언어 - 문장 맨 마지막에 ;(세미콜론) 넣어야 함 - 동적인 언어
모든 요소(*) : 모든 유형의 요소 css - * { 효과; } * { color: red; } 태그(tag) 이름 : html에서 사용하는 태그의 이름 html - css - 태그이름 { 효과; } h1 { font-family: cursive; } 속성(attribute) 이름 : 특정 속성이 포함된 요소를 지정 css - [속성이름] { 효과; } [href]{ color: magenta; } 특정 요소에서 특정 값을 가진 요소들에게 각각 다른 효과를 주고 싶다면, css - 요소이름[속성이름*=값] { 효과; } img[src*='winter'] { height: 50px; } img[src*='summer'] { height: 100px; } class (클래스) : 특정 요소만 선택하고 싶을..
CSS - Cascading Style Sheets - 웹페이지 디자인을 위한 언어 - HTML이 정보 전달에만 전념할 수 있도록 함 인라인 스타일(inline style) style 속성 이용 - html 코드 내에서 직접 css 코드 작성 - 속성의 값을 웹브라우저가 css의 문법에 따라서 해석하여 그 결과를 style 속성이 위치하고 있는 태그에 적용 - 선택자 필요 없음 - 2개 이상 스타일 지정할 때는 세미콜론으로 구분 - 자주 사용되지는 않음 CSS 내부 스타일시트(internal stylesheet) 태그 이용 - 내부에 style 태그 추가 선택자(Selector) - 스타일을 지정할 요소 선언 블록(Declaration Block) - css 선언을 포함하는 중괄호{ } 사이의 코드 선언..