본문 바로가기

아래로 스크롤 해주세요!

My Reference Book

-

제가 배웠던것을 한곳에 정리해보았어요!

HTML

HTML 태그 톺아보기

HTML

자세히보기

CSS

CSS 속성 톺아보기

CSS

자세히보기

JAVASCRIPT

JS 실행문 톺아보기

JAVASCRIPT

자세히보기

최신댓글

728x90

CSS11

#검색결과

총 11개를 찾았어요 ^^b

/

요소...를 숨...겨보자...! 요소를 숨기는 방법 요소를 숨기기 위해서는 총 5가지 방법이 있으며 해당 부분에 대해 알아보겠습니다. CSS : 예제용 간단한 예제를 만들어보기 위해 하단의 CSS를 작성하였습니다. .example{ background-color: #5f29d3; color: #fff; padding: 20px; border-radius: 10px; opacity: 1; } .example p{ padding: 15px; } .example:hover p.one{ display:none; } .example:hover p.two{ visibility: hidden; } .example:hover p.three{ opacity: 0; transition: all 0.25s; } .example:hover p.four{ w..
2022. 8. 25.
색을 정의하는 총 7가지의 다양한 방법! CSS 색상표현 CSS에서는 총 3가지 [색상 이름으로 표현/RGB 섹상값으로 표현/16진수 색상값으로 표현] 로 나뉘는데 각 표현에 대하여 배워보곘습니다. 색상의 이름으로 표현하는 방법 색상의 고유 이름으로 표현이 가능하며 대소문자를 구별하지 않으며, w3c에서 정의한 총 16개의 HTML4 표준 색상 이름은 아래와 같습니다. color: gray color: aqua color: black color: blue color: fuchsia color: green color: lime color: maroon color: navy color: olive color: purple color: red color: silver color: teal color: yellow color: white RGB 색상값..
2022. 8. 24.
스프라이트/ir효과/백그라운드 표현 방법에 대하여 가~보자고~! 스프라이트란? 여러가지의 이미지가 한 이미지 안에 모여 있는것을 말합니다 스프라이트 예시 제작해보기 스프라이트에 들어갈 각 그림간의 간격은 추후 background-position을 쉽게 파악하기 위해 좌표가 딱 50으로 떨어지게끔 작업해주고 스프라이트 이미지를 만들어 줍니다. CSS 코드 버튼의 글자는 가리고 이미지만 보여주기 위해 ir효과를 주어 글자는 숨기고 그림만 띄우게 css를 작성하겠습니다. 또한 간단한 hover효과를 주어 눈으로 좀 더 확인이 편하게 해보겠습니다. ir효과 : 리더기는 텍스트만 읽기 가능하기 때문에 이미지 설명을 위해 사용하며 시각적으로 불편함이 없도록 텍스트만 안보이게 숨겨주고 실제로 설명은 붙어있지만 이미지만을 보여줄때 사용하는 방법입니다. ir 효과 CSS코드보기 /*..
2022. 8. 20.
SCSS에 대해 알아봅시당~~ SCSS란? sass란 Syntactically Awesome Style Sheets의 약자로 CSS에서 복잡하게 넣었던 요소들을 scss를 통해 간단하게 표현 가능케해서 가독성을 높여주고 유지보수를 쉽게 해줍니다. SCSS 표기 예시 $font-stack: Helvetica, sans-serif; $primary-color: #333; body { font: 100% $font-stack; color: $primary-color; } SASS 표기 예시 $font-stack: Helvetica, sans-serif $primary-color: #333 body font: 100% $font-stack color: $primary-color CSS 기존 사용 예시 body { font: 100% Helv..
2022. 8. 19.
728x90
반응형

#HASH_TAGS

-

1

울적하니 꽃을 달아봤습니다 메서드 오늘 조업 마감했습니다. 오징어 1Kg 당 3000원 숙제가 다양해서 너무 좋아요 HTML 화사한가요? 오늘은 내가바로 오징어! 코딩 필터선택자 오징어 한마리 수확 완료! 선택해주세요 공부 scroll-snap-align 멈추지 않는 ' j ' 시리-즈 오징어 두마리 포획 완료 Method scroll-snap-type JQuery 내일은 즐거운 월요일 ImageSlideEffect 슬라이드 결과 : 월요일 제이쿼리 다크모드 코드 이건 또 뭐람 오늘도 웹표준은..