본문 바로가기

Front71

[Javascript] 변수 선언/데이터 타입/연산 1. 변수 선언 및 할당 let, const를 통해서 선언 2. 변수 선언과 데이터 타입 확인 변수를 선언하고 각 결과별로 데이터 타입 확인 //결과 datatype : number ex21.html:15 datatype : string ex21.html:16 datatype : boolean 3. 증감 연산자 ++(증가 연산자): 숫자형 데이터를 1씩 증가시키는 증가 연산자 --(감소 연산자): 숫자형 데이터를 1씩 감소시키는 감소 연산자 ① var A = ++B; 실행순서: B의 값을 1만큼 증가,증가된 B의 값을 A에 대입 ②var A = B++; 실행순서: B의 값을 A에 대입, B의 값을 1만큼 증가 3. 비교 연산자 두 데이터를 '크다, 작다, 같다'와 같이 비교할 때 사용하는 연산자 연산된 .. 2022. 9. 13.
[javascript] 기초 정리 1. 소스 기술 선언 - 코드 : 웹 브라우저에게 이 후부터 나타나는 코드는 HTML의 문법으로 해석하라고 브라우저에게 알려주는 구문(태그) 2. 소스 기술(실행) // 결과 출력 document.write('Hello ECMAScript 1'); // 디버깅 출력 - 개발자도구의 console 출력되며, 실행과정 확인 가능 console.log('Hello ECMASript 2'); - document.write(): 웹 페이지가 로딩될 떄 실행되면, 웹 페이지에 가장 먼저 데이터를 출력(웹 상 출력) - console.log(): 웹 브라우저의 콘솔을 통해 데이터를 출력(콘솔창 출력) 3. HTML 태그를 이용한 결과 출력 See the Pen Untitled by hbkuk (@hbkuk) on C.. 2022. 9. 8.
[CSS] display: inline, inline-block, block 1. display: inline에 대해서 대표적인 태그로는 , , 가 있으며, 본인의 text나 content 크기만큼만 공간을 점유하고 줄바꿈을 하지 않는 속성 width 적용 불가 height 적용 불가 margin 적용 불가 padding-top/bottom 적용 불가 line-height 유연 사용 불가 2. display: block에 대해서 대표적인 태그로는 , , 가 있으며, 한 라인을 점유하고, 다음 태그는 줄바꿈이 적용되는 특성 2022. 9. 7.
[CSS] a:link, a:visited, a:hover, a:active 보통 문서를 링크 시키기 위한 a 태그에 많이 사용 a:link 방문 전 링크 a:visited 방문 후 링크 a:hover 마우스 오버시 링크 a:active 마우스로 클릭시 링크 a:link { color: #ff0000; text-decoration: none;} a:visited { color: #00ff00; text-decoration: none;} a:hover { color: #ff00ff;} a:active{ color: #0000ff}; 순서가 바뀌면 CSS가 제대로 적용되지 않을 수 있으므로, 스타일 적용 순서는 위 순서대로 해야함. a 태그에는 밑줄 스타일 속성(text-decoration: underline)이 기본으로 적용되어 있으므로, 밑줄 스타일 속성을 제거 하고 싶을 떄는 .. 2022. 9. 7.
[CSS] 자식/후손/형제 선택자 자식 선택자 - 자손 선택자의 선택자 형태는 "선택자A > 선택자 B" - 선택자 A의 자손에 위치하는 선택자 B를 선택 부모 요소 > 자식 요소 { 속성명: 속성값; } div > p { color: red; } /* div 자식 요소 중 p인 태그 */ span > p { color: blue;} /* span 자식 요소 중 p인 태그 */ 후손 선택자 - 후손 선택자의 선택자 형태는 "선택자A 선택자 B" - 선택자 A의 후손에 위치하는 선택자 B를 선택 div p { color: red;} 형제(아우) 선택자 - A와 B가 같은 계층에 있을 때 A 바로 뒤에 B를 선택자로 지정 A + B h1 + h2 { color: red; } - 태그 바로 뒤에 위치한 태그 1개만 색을 빨강으로 변경 A ~ .. 2022. 9. 7.
[HTML] input tag 총정리 input tag의 기본 형식 hidden 사용자 안보임 text 텍스트 박스 search 검색 박스 tel 전화번호 박스 url url 주소 박스 email 이메일 박스 password 비밀번호(***) datetime 국제 표준시 date 연/월/일 박스 month 연/월 박스 week 연/주 박스 time 시/분/초 박스 number 숫자 조절 박스 range 슬라이드 막대 color 색상표 checkbox 체크박스 radio 라디오 버튼 file 파일 첨부 submit 전송 버튼 reset 리셋 버튼 button 버튼 See the Pen tag by hbkuk (@hbkuk) on CodePen. input tag의 사용할 수 있는 속성(아래 사이트 참고) 코딩교육 티씨피스쿨 4차산업혁명, 코딩.. 2022. 9. 6.

티스토리툴바