HtmlCss42 CSS - list(기호) - list의 블릿기호 변경하기 list-style-type: disc,square,circle -> 순서가 없는 리스트 ul은 ol 기호가 적용되지 않지만 ol은 상관없다. number, lower-alpha, upper-alpha, lower-roman, upper-roman none --> 블릿기호 출력 안함 -블릿기호를 이미지로 대신해서 사용하기 list-style-image:url('경로명/그림파일명.확장자'); list 데이터들을 메뉴 형태로 변경하기 2019. 5. 25. CSS - opacity , visibility img{ width:120px; height:120px; } img.one{ opacity:0.3; } img.two{ visibility: hidden; } img.three{ display:none; /*display를 none으로 설정하면 해당 객체가 출력도 되지 않은 상태로 만들어 준다.*/ opacity : 불투명도를 나타낸다. 0~1사이의 값을 설정한다. 0 : 완전 투명, 1: 완전 불투명 Visibility : 대상이 화면에 보이거나 보이지 않게 설정한다. hidden : 안보인다. visible: 보인다 2019. 5. 25. CSS - Position 1번영역 2번영역 3번영역 -요소의 출력 위치를 지정하는 방법 top, left, right, bottom을 이용하여 요소의 출력 위치를 지정할 수 있는데 이 속성들은 position의 영향을 받는다. top : 위쪽에서부터 떨어진 거리(y축좌표) left : 왼쪽에서부터 떨어진 거리(x축좌표) right : 오른쪽에서부터 떨어진 거리( bottom : 아래쪽에서부터 떨어진 거리 position 좌표를 지정하는 기준을 설정한다. static :기본적인 흐름에 맞게 위치가 결정된다.(기본값이고 출력 위치를 임의로 변경할 수 없다.) relative :정상적으로 출력될 위치를 기준으로상대적인 위치를 설정할 수 있다. absolute : 컨테이너의 원점을 기준으로 위치를 설정한다.(컨테이너 => 자신을 포함하.. 2019. 5. 25. 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. 이전 1 2 3 4 5 6 7 ··· 11 다음
