본문 바로가기
반응형

IT102

[CSS] background 속성 background-repeat (배경이미지를 어떻게 반복시킬지 정한다) repeat - 가로세로로 반복 repext-x / y - x축 또는 y축으로 반복 no-repeat - 반복하지 않음 div{ background:url("../img/page_btn_pc.png") 80% center repeat-x; width:500px; height:150px; border:1px solid red; } repext-x 했을 때 결과값입니다. div{ background:url("../img/page_btn_pc.png") 80% center repeat-y; width:500px; height:150px; border:1px solid red; } repext-y 했을 때 결과값입니다. background.. 2020. 1. 1.
[css] CSS 기본 속성 Font 속성 body {font-size: 12px; font-family:'Nanum Gothic', sans-serif;} h1{font:15px "굴림",Gulim;} font-weight : 글씨를 두껍게 한다(bold, normal) font-style : 기울이거나, 바로세운다(italic, normal) text-align (블록 요소에만 사용가능합니다) 속성 값 -> left(왼쪽 정렬), right(오른쪽 정렬), center(가운데정렬), justify(중앙정렬) 왼쪽 정렬 text-align:left 오른쪽 정렬 text-align:right 가운데 정렬 text-align:center 양쪽 정렬 text-align:justify div{float:left; width:300px; .. 2019. 12. 31.
[javaScript] 함수1 함수를 사용하여 코드를 저장한 것을 함수 정의문이라고 합니다. 변수를 선언할 때 var 키워드를 사용한 것처럼 함수에서는 function 키워드를 사용해 변수를 선언합니다. 기본형은 아래와 같이 선언합니다. 다음과 같이 익명함수(함수명이 없는 함수)를 선언하고 변수에 참조해도 됩니다. 함수 정의문({...})안에 작성된 코드는 즉시 실행되지 않습니다. 함수는 메모리에 할당되어 대기하고 있다가 함수가 호출되면 실행됩니다. 정의 되는 함수를 호출하는 아래와 같습니다. 함수명(); 또는 참조 변수(); var count=0; myFnc(); function myFnc(){ count++; document.write("hello" + count," "); } myFnc(); var theFnc=function(.. 2019. 12. 30.
[javascript] 브라우저모델 BOM window 객체 window 객체의 메서드 종류 종류 설명 open("URL","새창이름","새창옵션") URL 페이지를 새 창으로 나타냅니다. alert(data) 경고 창을 나타내고 데이터를 보여줍니다. 방문자가 [확인] 버튼을 누르면 alert()를 사용한 다음 위치의 코드를 수행합니다. prompt("질문","답변") 질문과 답변으로 질의응답 창을 나타냅니다. confirm("질문내용") 질문 내용으로 확인이나 취소 창을 나타냅니다. [확인]버튼을 누르면 true를 반환하고, [취소] 버튼을 누르면 false를 반환합니다. moveTo(x,y) 지정한 새 창의 위치를 이동합니다. resizeTo(width,height) 지정한 새 창의 크기를 변경합니다. setInterval(function().. 2019. 12. 30.
[html] summary, progress details 요소와 summary요소 세부 항목이나 추가 정보를 숨겨 놓았다가 펼쳐서 보여줄 수 있는 기능입니다. 세부 항목의 제목이나 요약 내용입니다. 안녕하세요 on sunday on sunday의 tistory입니다. 1,2,3 - 하루 여행 슝 IT 안녕하세요 on sunday on sunday의 tistory입니다. 1,2,3 - 하루 여행 슝 IT progress요소는 진행 상황같은 내용을 나타낼 때 사용하며 meter요소는 정해져 있는 범위의 값에서 현재 상태의 값을 나타낼 때 사용됩니다. value는 현재 값을 의미합니다. 안녕하세요 on sunday 티스토리 로딩중 : 0% 로딩 상황 하루 게시판 로딩상황: 20% 여행 게시판 로딩상황: 60% IT 게시판 로딩상황: 70% 안녕하세요 .. 2019. 12. 28.
[html] form 요소 form 요소는 온라인 서식에서 작성한 값들을 서버 프로그램(서식값 처리)으로 전송하는 역할을 담당하며 블록 요소 입니다. fieldset은 블록 요소이며 form요소 안에 있는 여러 요소를 그룹화 할 때 사용하며 그룹제목 legend요소를 포함합니다. 그룹제목 label for="for 값" -> for값을 input요소의 id값과 동일하게 하면 편의성을 확대시켜줍니다. (label의 텍스트를 선택해도 input값에 커서가 이동) maxlength="8" -> 최대로 쓸 수 있는 글자 수입니다. required -> input값이 입력되었는지에 대한 부분과 유효성을 판단해주는 속성입니다. placeholder의 속성변경 선택자는 input::placeholder입니다. 아이디 : .list_conten.. 2019. 12. 27.
[javascript] - 내장객체(문자열) 문자열 객체 문자열 객체는 문자형 데이터를 객체로 취급하는 것으로, 자바스크립트에서 가장 많이 사용합니다. 아래는 기본형 예시입니다. var 변수 = new String(문자형 데이터) var t = new String("Hellow javascript");//문자열 객체 생성 var 변수 = 문자형 테이터 var t = "Hellow javascript";//문자열 객체 생성 문자열 - 메서드 및 속성 종류 설명 charAt(index) 인덱스 번호에 해당하는 문자를 반환합니다. indexOf("찾을 문자") 왼쪽부터 찾을 문자와 일치하는 문자를 찾아 제일 먼저 일치하는 문자의 인덱스 번호를 반환합니다. 만일 찾는 문자가 없으면 -1을 반환합니다. lastIndexOf("찾을 문자") 오른쪽부터 찾을 .. 2019. 12. 26.
[javascript] - 내장객체(배열) 배열객체 여러개의 데이터를 하나의 저장소에 저장하기 위한 배열 객체입니다. //기본형 var 배열객체=new Array(); 배열객체[0]= 값1; 배열객체[1]=값2; 배열객체[2]=값3;... var 배열객체=new array(값1, 값2, 값3....) var 배열객체[값1, 값2, 값3...]; 방식1 var onSunday=new Array(); onSunday[0]="carina"; onSunday[1]=16; onSunday[2]="tistory"; 방식2 var onSunday=new Array("carina",16,"tistory"); 방식3 var onSunday=["carina",16,"tistory"]; 배열 객체에 저장된 데이터 불러오는 방법. var onSunday=["carin.. 2019. 12. 25.
[javascript] - 내장 객체(날짜,수학) 내장 객체 생성 기본형 : 참조변수(인스턴스 이름) = new 생성 함수() var tv = new Object(); tv.color = "white"; tv.price = 3000000; tv.info = function(){ document.write("tv 색상 : " + this.color," "); document.write("tv 가격 : " + this.price," "); } var car = { color:"black", price:5000000, info:function(){ document.write("car 색상 : " + this.color," "); document.write("car 가격: " + this.price," "); } }; document.write("tv 객체 메.. 2019. 12. 24.
반응형

티스토리툴바