본문 바로가기
반응형

개발/Front-End19

(자바스크립트) function() 함수에 대해서 알아보자. 나는 자바를 기반으로 프로그래밍을 배웠다. 그렇기에 캡슐화에 대한 공부를 하였고, 프론트엔드 단에서 자바스크립트를 이용하여 객체를 만들고자 했을 때 자바스크립트는 어떻게 만들 수 있는지 알게 되어 그 부분을 공유하려고 한다. 이번에 기재할 내용은 함수 function()이다. 자바스크립트에서는 function()을 어떤식으로 취급하는 지 알아보자. 1. 기명 함수표현식 2. 익명 함수표현식 3. 콜백함수 4. 즉시실행함수 1. 기명 함수표현식(Named function expression) 여러 프로그래밍 언어에서 사용하는 개념과 유사하지만 다른 게 있다. 바로 function()은 자바스크립트에서 객체로 취급이 가능하다. 때문에 함수의 매개변수로 함수를 입력할 수 있다. (1) 일반적인 함수 선언 fu.. 2018. 5. 13.
CSS border 속성 사용하는 방법 border는 div,table,p 등등 여러 태그들에 테투리를 표시하는 속성이다. border 속성은 아래와 같다. 1. border 태그의 동서남북 4면에 테두리를 표시한다. border: width style color; 로 사용한다. (예시: border:1px solid black) 속성 설명) - width 속성값 설명 medium 2px 굵기로 표시, 기본설정값 thin 1px 굵기로 표시 thick 5px 굵기로 표시 length 입력된 수치로 굵기를 표시(cm, mm, in, px, pt, pc 단위로 입력) initial 기본설정값으로 굵기를 표시(medium) - style 속성값 설명 none 기본값, 테두리 표시 안함. hidden none과 같음 dotted 점 선으로 테두리 표.. 2018. 4. 21.
퍼블리싱에 대한 팁 정리 최근 회사를 다니면서 홈페이지 리뉴얼을 진행하게 되어 퍼블리싱에 대해 배워가고 있다. 공유하면 괜찮을 것 같다는 생각이 들어 적어보려고 한다. 1. 반응형을 고려해야 한다. 최근 홈페이지들은 변화하는 브라우저의 해상도에 맞게 화면의 내용이 바뀌게 된다. 학원에서는 반응형이 마냥 어려운 것으로만 알고 있었는데 막상해보니 그렇지는 않았다. CSS에는 @media라는 어노테이션이 있는데 device의 width, height 혹은 viewport의 width, height를 체크하여 지정된 해상도와 맞을 경우 @media {} 안에 있는 css를 적용시킨다. @media type은 아래와 같다. Value Description all 기본설정값, 모든 device에 적용 print 프린터에만 적용 screen.. 2018. 4. 20.
배경화면이 적용된 div 위에 div 배치하기 배경화면이 적용될 div의 css 속성을 아래와 같이 지정하였다. background-image:url('url 경로'); background-repeat : no-repeat; background-size: 100% 100%; 그 후 아래와 같이 div 위에 배경화면 안에 배치될 div를 코딩했다. 톰캣을 실행 결과 화면에 div가 나오지 않는다. component div의 크기가 있더라도 background div의 width와 height를 지정해주지 않았기 때문이다. 그래서 width, height를 주려고 했으나 %는 적용이 되지 않았다. 그렇다고 px값을 입력하면 반응형 웹을 만들기에는 부적절하기 때문에 고민 끝에 padding을 통해 상하 %를 입력하여 원하는 형태의 이미지 배치를 얻을 수 .. 2018. 2. 18.
반응형