본문 바로가기

학원

 (182)
[CSS] 박스모델(BoxModel) 관련 속성 박스모델(BoxModel) : 문장 또는 이미지를 출력하기 위해 태그를 사용하여 생성한 사각형 모양의 영역 margin : 박스모델과 박스모델 간격 관련 스타일 속성 테두리와 이웃하는 요소 사이의 간격이다. 마진은 눈에 보이지 않는다. → margin-top, margin-right, margin-bottom, margin-left 속성값 : px(절대값 - 고정크기), %(상대값 - 유동크기) border :내용와 패딩 주변을 감싸는 테두리 border-style : 박스모델 외곽선의 모양 관련 스타일 속성 → border-style-top,border-style-right, border-style-bottom, border-style-left 속성값 : nono(기본), solid(실선), dotte..
[CSS] 배경 관련 스타일 속성 배경 관련 스타일 속성 background-color : 배경색 관련 스타일 속성 - 색 관련 속성값 배경 관련 스타일 속성 배경색을 설정해 보세요. 번호이름주소 1000홍길동서울시 강남구 2000임꺽정부산시 사하구 3000전우치수원시 팔달구 4000일지매부천시 원미구 5000장길산인천시 남동구 background-image 배경 이미지 관련 스타일 속성 속성값 : url 함수를 사용하여 이미지 파일의 URL 주소 설정 → 배경 이미지가 박스모델의 폭 또는 높이보다 작은 경우 가로 방향(X) 또는 새로 방향(Y)으로 이미지가 반복 출력된다. background-repeat 배경 이미지의 반복관 관련된 스타일 속성 속성값 : repeat(기본), repeat-x, repeat-y, no-repeat 배경 ..
[CSS] 글자, 공백, 문장 관련 스타일 속성 글꼴 관련 스타일 속성 font-family : 글꼴 관련 스타일 속성 - 글꼴을 속성값으로 설정한다. → 글꼴은 나열이 가능하며, 순차적으로 적용된다. font-family 속성이 생략되거나 속성값으로 설정된 글꼴이 없는 경우에는 클라이언트 플랫폼(OS)의 기본 글꼴을 사용한다. 때문에 클라이언트마다 다른 글꼴이 사용되어 출력된다는 문제점이 발생한다. CSS 글꼴 관련 스타일 속성 브라우저에 출력될 아주 중요한 내용입니다. 브라우저에 출력될 아주 중요한 내용입니다. 브라우저에 출력될 아주 중요한 내용입니다. 브라우저에 출력될 아주 중요한 내용입니다. 브라우저에 출력될 아주 중요한 내용입니다. 웹폰트(WebFont) 웹서버에 저장된 글꼴파일을 클라이언트에게 제공하여 사용하는 기능 웹폰트는 방문자의 로컬 ..
[MAC] 오라클 디벨로퍼 날짜 형식 설정 SQL 복습하려구 연습중인데 날짜 형식이 이상하게 떠서..바꿨당 날짜 설정 바꿔주려면 환경설정에 들어가야하는데 말썽쟁이 맥북에는 환경설정이 엄더라.. 알고보니까 Preferences에 들어가야했음 ㅎ ; 날짜 형식이 이상하게 뜸 ㅠ 우측 상단의 Oracle SQL Developer 클릭 >> Preferences 클릭 날짜 검색 후 NLS 클릭해주고, 날짜형식을 원하는대로 지정해주면 된다~~ 나는 RR/MM/DD 형식으로 지정했다. 원하는 형식으로 잘 뜬당 ㅎ
[CSS] 선택자(Selector) 선택자(Selector) : 태그(박스모델)를 선택하기 위한 표현식 → 선택자에 의해 선택된 태그(박스모델)를 엘리먼트(Element)로 표현한다. 선택자를 통해 특정 요소들을 선택하여 스타일을 적용할 수 있다. 기본 선택자 - 태그 선택자, 클래스 선택자, 아이디 선택자 전체 선택자 [*] : 모든 태그를 엘리먼트로 선택한다. (비권장) * { margin: 0; padding: 0; } 1) 태그 선택자 : 태그의 이름을 이용하여 엘리먼트를 선택한다. → 태그의 이름이 같은 다수의 엘리먼트에 동일한 스타일을 적용할 수 있다. h2 { color : green; } p {color: blue; } 2) 클래스 선택자 ★ : 태그에 설정된 class 속성값을 이용하여 엘리먼트로 선택한다. → 태그 선택자..
[CSS] CSS 언어란? / style 태그 / CSS의 상속 / HTML 문서에 스타일 시트를 적용하는 방법 CSS(Cascading Style Sheet) HTML 문서에 모양과 서식을 제공하기 위한 스타일 시트 언어 HTML 태그를 사용하여 웹문서를 구성하고 CSS를 사용하여 웹문서에 스타일(디자인) 적용 → 웹문서 작성에 대한 생산성 증가 및 유지보수의 효율성이 증가한다. CSS를 사용하기 전에는 디자인 관련 HTML 태그와 속성을 사용해 웹문서를 작성했다. 하지만 CSS를 사용하지 않고 HTML 태그와 속성을 사용해 디자인하면, 스타일을 바꿀 때 하나씩 다 바꿔줘야하기 때문에 매우 불편하다. → 웹문서 작성에 대한 생산성이 저하되고, 유지보수의 효율성이 감소한다. Old style 브라우저에 출력될 아주 중요한 내용입니다. 브라우저에 출력될 아주 중요한 내용입니다. 브라우저에 출력될 아주 중요한 내용입니..
[HTML] 제출이벤트 / label태그 / textarea 태그 / select 태그 / datalist 태그 / fieldset 태그 form 태그에는 입력태그외에 제출 이벤트를 발생시키는 태그가 반드시 존재해야한다. 제출이벤트를 발생해야만 form 태그가 실행되어 웹프로그램을 요청해 입력값을 전달할 수 있기 때문이다. input 태그의 type 속성값을 [submit]으로 설정하여 태그(버튼)을 클릭한 경우 제출이벤트가 발생한다. 또는 button 태그의 type 속성값을 [submit]으로 설정하여 태그(버튼)을 클릭한 경우에도 제출이벤트를 발생시킬 수 있다. 회원가입 form 태그의 하위태그에 입력태그의 입력값을 초기화 처리하는 기능의 태그를 작성할 수 있다. → 초기화 이벤트 (Reset Event) input 태그의 type 속성값을 [reset]으로 설정하여 태그(버튼)을 클릭한 경우 초기화 이벤트가 발생한다. 또는 butt..
[HTML] 리퀘스트 메세지 / form 태그 / input 태그 id 속성 : 태그를 구분하기 위한 식별자(고유값)를 속성값으로 설정 → 절대로 중복되어선 안된다. 앵커(Anchor) : 출력 페이지에서 특정 태그의 위치로 스크롤을 이동하는 기능 a 태그의 href 속성값으로 URL 주소를 설정하면 클릭 이벤트에 의해 페이지를 이동할 수 있다. → URL 주소 뒤에 # 기호를 사용하여 태그 식별자(id 속성값)를 설정하면 해당 식별자의 태그로 출력위치를 이동할 수 있다. - 앵커 제품소개 구매후기 >> 태그 식별자가 각각 product, review인 곳으로 출력위치를 이동한다. 동일한 웹문서에서 스크롤을 이동할 경우 요청 웹문서의 URL 주소 생략이 가능하다. 주의사항 #top으로 설정하면 처음 화면(맨 위)으로 출력위치가 이동한다. [처음으로] map 태그 : 이..

티스토리툴바