본문 바로가기

분류 전체보기117

font 및 글자 기타 속성 font 속성font-size: 글자 크기font-family : 글꼴font-style : 글자 스타일font-weight : 글자 두께한꺼번에 지정 --> font : font-style font-weight font-size font-family;text-align : 글자 정렬left(기본), right, center, justifyline-height: 행간text-decoration : 언더라인등의 설정 2024. 7. 8.
배경이미지 설정하기 background-image : url(이미지경로);기본적으로 배경이미지를 설정하게 되면 벽지의 패턴처럼 가로, 세로 반복하여 보여준다.background-repeat : no-repeat;속성값이 repeat-x : x축으로만 반복속성값이 repeat-y : y축으로만 반복background-position : center;background-size: cover;background-attachment : fixed;한화면에 내용을 다 보여줄 수 없고 스크롤이 있는 경우 스크롤을 움직여도 항상 고정된 위치에 배경이미지를 보여준다.기본값은 scroll 이며 스크롤이 변경되면 배경이미지가 보이지 않는다.위의 속성들을 한꺼번에 설정할 수도 있다.background:lightblue url(img.jpg) .. 2024. 7. 8.
정처기 필기 합격했습니다 ㅎㅎ 사실 어제 아침에 시험을 보고 합격했는데, 약속이 있었어서 지금 포스팅 하게 되었습니다시험은 다행히 이미 한번 기출에서 본 문제들이나 개념들이 많이 나왔던것 같습니다개인적으로는 책을 보는것보다는 cbt 사이트에서 기출 풀었던게 더 도움이 되었던거같아요 사실 정처기는 실기가 진짜 어렵다고 하니 보기 전에 빠릿하게 준비해놔야겠어요 ㅎㅎ 2024. 7. 8.
둥근테두리 설정 border-radius : 10px border-radius : 0 20px 0 20px 2024. 7. 5.
box sizing box-sizing: content-box (기본값) : 가로, 세로 크기를 설정했을 때 컨텐츠에 대한 크기를 말하며 테두리  두께와 안쪽여백을 고려해야 한다.boxsizing : border-box : 가로, 세로 크기를 설정하면 컨텐츠, 안쪽여백, 테두리 두께까지를 합한 크기가 된다. 2024. 7. 5.
색상 설정하기 red, blue, green 처럼 미리 정해진 값을 이용해 설정rgb 함수를 이용해서 설정(각 값은 0~255의 정수값을 가짐)#rrggbb 의 형태로 컬러값을 설정(0~255까지를 16진수로 표현한다. 00~ff)rgba 이용해서 투명도 값까지 설정 2024. 7. 5.
선택자 CSS를 지정하기 위하여 대상이 되는 노드 (태그) [들]을 선택하는 것을 말한다.  태그이름{} --> 특정 태그에 대하여 CSS를 적용한다..클래스이름{} --> 서로 관련 있는 요소들을 그룹을 지어 줄 때 CLASS 를 사용한다. 특정 클래스에 대하여 CSS를 적용한다.#아이디이름{} --> 요소들 중에 유일한 식별자를 지정하기 위하여 ID 를 이용한다. 특정 ID 를 갖는 요소에 대하여 CSS를 적용 한다.*{} --> 모든 태그 --> HTML 의 모든 요소를 지칭할 때 *(와일드 카드 문자)를 사용한다. HTML 의 모든 요소에 CSS를 적용한다.태그이름[속성명] -> 그 태그의 특정 속성이 있는 요소태그이름[속성명=값] -> 그 태그이 속성 값을 만족하는 요소들만 선택후손 선택자 : 기준노드.. 2024. 7. 5.
div, span와 시멘틱 태그 전통적으로 화면 배치 또는 공간 분할을 위하여 div 와 span 을 많이 사용한다.현재는 시멘틱 태그를 사용하기를 권장하지만 여전히 현장에서는 div 와 span 을 사용하고 있다.div : 블록 형식으로 공간을 분할 => 세로로 배치, 크기를 설정할 수 있다.span : 인라인 형식으로 공간을 분항 => 가로로 배치, 크기를 설정할 수 없다.인라인 블록(inline-block ) : 인라인이면서 블록 성격을 가짐 => 가로로 배치 => 크기 설정 가능span, div 둘 다 inline -block 으로 변경 가능 블록형식 태그 : div, h1~h2, p, li, table인라인형식 태그 : span, a, input, select등등 입력양식 태그, b, i 등 글자 관련 태그전통적으로 화면(공간.. 2024. 7. 5.