본문 바로가기

분류 전체보기83

Css- border border 연습 none dotted dashed solid double groove ridge inset outset border-radius : 둥근 테두리선 box-shadow : box의 그림자효과 text-align : 글씨를 좌우로 정렬해준다. display : 출력 영역의 성지를 변경한다. border-width : 테두리선의 두께 border-color : 테두리선의 색깔 border-style : 테두리선의 종류 Css div를 display:teble-cell;로 만들어서 table을 만들어주는 사람도 있다. 그 이유는 레이아웃이 편해서이다. 이때 안에 있는 내용을 중앙으로 정렬하기 위해서는 vertical-align:middle; 설정을 해주면 된다. 2019. 5. 25.
Css - background 배경 이미지 설정하기 backgorund-image: url('경로명/그림파일명.확장자'); -CSS에서 경로를 상대경로로 설정할 때 기준위치(현재위치) 인라인CSS, 내부CSS ==> HTML문서의 저장 위치 외부CSS ==> 외부CSS 파일의 저장 위치 -배경 이미지의 반복 여부 설정 repeat (상하좌우 반복) -> 기본값 no-repeat(반복하지 않는다.) repeat-x, repeat-y (x축, y축 방향으로만 반복) background-position top, center, bottom -> 상하 left, center, right -> 좌우 background-size: 가로, 세로 배경이미지의 크기. background-attachment local,scroll (배경과 내용이 같이 .. 2019. 5. 25.
Css- Block요소,Display h1태그의 영역입니다. p태그의 영역입니다. div태그의 영역입니다. pre태그의 영역입니다 em태그의 영역입니다. span태그의 영역입니다. a태그의 영역 inline-block은 줄바꿈이 없는 inline성질과 크기를 지정할 수 있는 block요소의 성질을 갖는다. display inline요소와 block요소의 성질을 변경할 수 있다. none : 요소를 출력하지 않습니다. block : block요소로 출력합니다. inline : inline 요소로 출력합니다. inline-block : 줄바꿈이 없는 block요소로 나타낸다. table-cell :table의 cell과 같은 성질의 요소로 나타낸다. table : table과 같은 성질의 요소로 나타낸다. 블록요소 자동 줄바꿈 기능이 있다. 가.. 2019. 5. 25.
Css - 의사 클래스 보통글자 사이트명 사이트명 안녕하세요 의사 클래스 클래스가 정이된 것처럼 간주되어 처리되는 것 셀렉터:의사클래스명 { 스타일 정의 } 의사 클래스 명 셀렉터:link ==> 방문한 내역이 없는 링크 걸린 부분에 스타일을 적용한다. 셀렉터:visited ==> 방문한 내역이 있는 링크 걸린 부분에 스타일을 적용한다. 셀렉터:hover ==> '셀렉터'에 해당하는 요소에 마우스 커서가 놓였을 때 스타일을 적용한다. 셀렉터:active ==> '셀렉터'에 해당하는 요소를 클릭하는 순간 스타일을 적용한다. 그외 text-decoration의 기능으로 밑줄을 없애거나 밑줄을 생성할 수 있다. text-decoration: none; / underline; 2019. 5. 25.