코린이 잰이

Html로 레이아웃을 꾸밀 때 필연적으로 사용하게 되는 태그가 있습니다.

바로 <div>와 <span>태그 입니다.

이 두태그는 비슷하면서도 다른데 차이점을 알아보겠습니다.

예제

가로폭을 전부차지하는 div와 달리 태그안의 내용까지만 차지하는 span

크기조정가능한 div(상자안에 있어요!!) 와 불가능한 span(문장단위로 지정이 되요!!)

필연적인 줄바꿈div와 줄바꿈이 없는 span

절대경로

어떠한 웹 페이지나 파일이 가지고 있는 고유한 경로를 절대경로라고 합니다.

웹페이지에서 이미지의 URL을 가지고 오거나 내 컴퓨터 안의 이미지 경로를 가져올 때 절대경로를 사용하는 것 입니다.

<img src="http;//www......../image.jpg"> -웹페이지 이미지 주소를 불러오는경우

<img src="C:\user\...\image.jpg"> -내 컴퓨터 안의 이미지 경로를 불러오는 경우

위의 방식을 절대경로를 이용한 방식이라고 합니다.

그러나 절대경로를 이용하면 웹페이지의 이미지가 사라지거나 내컴퓨터에서 만든 파일을

다른 웹서버로 올릴 때에는 다시 고쳐줘야 하는 불편함이 있습니다.

상대경로

작업중인 공간을 기준으로 상대적인 위치를 가리키는 경로를 상대경로라고 합니다.

이미지의 파일이 같은 폴더에 저장되어있을 경우 파일명만 적어주면되고

하위 폴더에 저장되어 있는 경우에는 "폴더명/이미지파일" 처럼 사용하면되고

상위 폴더에 저장되어 있는 경우에는 "../폴더명/이미지파일" 처럼 사용하시면 됩니다.

<img src="image.jpg"> -같은 폴더안의 image사용

<img src="file/image.jpg"> -하위폴더 file안의 image 사용

<img src="../file/image.jpg"> -상위폴더 file안의 image 사용  

JavaScript로 처음 만들어본 계산기 UI 입니다.

HTML을 사용하였고 table을 이용했습니다.

분홍 박스는 연산자 부분이고 기본지원 eval 함수를 사용하였습니다.

파란 박스는 함수 부분이고 기본 지원 Math 함수를 사용하였습니다.

노란 박스는 abs함수가 있다고는 하나 직접 만들어보았습니다.

계산기의 함수부분입니다.

function btn(num)

계산기 텍스트 창에 숫자 넣기 및 total 값 넣기

function btnclear()

total 값 초기화 및 텍스트 창 내용 지우기

function btncal()

계산된 값 텍스트 창에 띄우기

function btnop()

연산자 클릭시 텍스트 창 내용 지우기 및 total 연산자 추가

function btnpow()

제곱 값을 total 값 넣기 및 텍스트 창 출력

function btncos()

cos 값을 total 값 넣기 및 텍스트 창 출력

function btntan()

tan 값을 total 값 넣기 및 텍스트 창 출력

function btnabs()

 절대값 변환 및 total 값넣기 및 텍스트 창 출력

전체 코드