본문 바로가기

HtmlCss/CSS20

CSS -텍스트 장식 text-decoration 예제입니다. text-decoration 예제입니다. text-decoration 예제입니다. Text transForm is UpperCase Text transForm is lowerCase Text transForm is capitalize Text-shadow 연습 영어의 경우 긴 단어가 출력될 영역을 벗어났을 때 단어를 자동으로 잘라서 줄바꿈 해주는 기능은 'word-wrap'속성에 'break-word'값을 설정하면 되고 자동 줄바꿈을 하지 않으려면 'normal'이라고 설정하 면 된다. aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa text-decoration overline : 윗줄 line-thro.. 2019. 5. 25.
CSS - text-decoration text-decoration : ; none : 선을 만들지 않음 line-through : 글자 중간에 선 overline : 글자 위에 선 underline : 글자 아래에 선 initial : 기본값으로 설정 inherit : 부모 요소의 속성값을 상속 2019. 5. 25.
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.