728x90
반응형

개발 5

#6. 버튼(class)에 효과 주기 - 버튼 장식 및 효과

3. 장식 및 효과box-shadow: 박스 그림자box-shadow: 10px 10px 5px gray;text-shadow: 텍스트 그림자오프셋, 흐림 반경, 색상: text-shadow: 2px 2px 5px red;background-image: 배경 이미지URL: background-image: url('image.png');background-size: 배경 이미지 크기픽셀, 퍼센트, cover, contain: background-size: cover; background-position: 배경 이미지 위치background-position: center;, background-position: 10px 20px;background-repeat: 배경 이미지 반복repeat, no-repea..

개발/html 2024.06.22

#4. 버튼(class)에 효과 주기 - 기본 스타일링(테두리,텍스트)

1. 기본스타일링_2border: 테두리 스타일두께, 스타일, 색상: border: 1px solid black;스타일 종류none테두리가 없음hiddennone과 유사하지만, 테이블 요소의 테두리를 숨길 때 사용dotted점선으로 된 테두리dashed대쉬(긴 점)로 된 테두리solid실선 테두리double두개의 실선으로 된 테두리groove테두리가 홈이 파진 것처럼 보임.테두리 색상은 음영 처리ridge테두리가 솟아오른 것처럼 보임groove와 반대로 테두리 색상은 양각 처리.inset테두리가 요소 안쪽으로 들어간 것처럼 보임입체적outset테두리가 요소 밖으로 돌출된 것처럼 보임입체적예시: border: 2px dashed red;border-radius: 테두리의 모서리 곡선 정도픽셀 단위: bor..

개발/html 2024.06.22

#3. 버튼(class)에 효과 주기 - 기본 스타일링(색상)

1. 기본 스타일링color: 텍스트 색상색상 이름: color: red;HEX 코드: color: #ff0000;16진수로 색상을 표현RGB: color: rgb(255, 0, 0);설명: 빨강(Red), 초록(Green), 파랑(Blue)의 세 가지 색상 값 형식: rgb(red, green, blue)범위: 각 값은 0에서 255 사이의 정수RGBA: color: rgba(255, 0, 0, 0.5);설명: RGB 값에 알파(Alpha) 값(투명도)을 추가하여 색상을 표현형식: rgba(red, green, blue, alpha)범위: 각 RGB 값은 0에서 255 사이의 정수, 알파 값은 0.0(완전히 투명)에서 1.0(완전히 불투명) 사이의 소수HSL: color: hsl(0, 100%, 50%..

개발/html 2024.06.22

#1. 파비콘 설정하기(이미지로 설정)

1.  파비콘 사이즈는 조절 불가(현재 알기론) 2.title = 웹 이름link = 외부 리소스를 현재 문서에 연결할 때 사용예를 들어, rel="stylesheet"는 링크된 파일이 CSS 스타일시트임을 나타냄다른 예로 rel="icon"은 이는 링크된 파일이 파비콘임을 나타냄href = 링크된 리소스의 URL(경로)을 지정type type 속성은 링크된 리소스의 MIME(Multipurpose Internet Mail Extensions) 유형을 지정예를 들어, CSS 파일의 경우 type="text/css"를 사용파비콘의 경우 type="image/png" 또는 type="image/x-icon"을 사용2. 코드 파트/* IntelliJ */민소 World/* STS */민소 World 전체 코드..

개발/html 2024.06.22
728x90
반응형
LIST