본문 바로가기

웹프로그래밍/웹프로그래밍수업35

(23)명품 웹프로그래밍 4장_CSS_6 # 범위 :border 테두리 둥글게 속성 border 테두리 이미지 입히기 속성배경에 이미지 입히기 속성Text 그림자 효과와 알아두면 좋은 효과set종류 3가지박스 그림자 효과마우스 커서 효과# 노트정리 :border 테두리 둥글게 속성 :border 테두리 이미지 입히기 속성 :배경에 이미지 입히기 속성 :Text 그림자 효과와 알아두면 좋은 효과set종류 3가지 :박스 그림자 효과 :마우스 커서 효과 :○ 요약 :● Border 테두리 둥글게 하는 효과 속성 :1_ 속성 : border-radius 2_ 속성값 대입 방법 2가지 :방법1_ border - radius : 10px (left-top부터 시계방향으로 10px 균등하게 효과)방법2_ border - radius : 10px 20px 3.. 2024. 10. 4.
(22)명품 웹프로그래밍 4장_CSS_5 # 범위 :박스모델의 정의와 구성박스모델 구성의 틀과 색깔칠 속성박스모델 구성의 크기, 위치조정 속성_컨텐츠박스모델 구성의 크기, 위치조정 속성_paddingborder의  단축 프로포터  # 노트정리 :박스 모델의 정의와 구성 :박스모델 구성의 틀과 색깔칠 속성 :박스모델 구성의 크기, 위치조정 속성_컨텐츠 :박스모델 구성의 크기, 위치조정 속성_padding :박스모델 구성의 크기, 위치조정 속성_margin :border의 단축 피라미터 :○ 요약 :● 박스모델의 정의와 구성1_정의 : 모든 태그에는 박스모델로 되어있다는 뜻2_ 구성(4가지) : 컨텐츠, padding, border, margin ● 박스 모델의 틀과 색깔적용 속성컨텐츠 : X //과 같은 걸로 적용해서, background-col.. 2024. 10. 3.
(21)명품 웹프로그래밍 4장_CSS_4 # 범위 :색깔과 관련된 속성과 속성값margin-top,left,right,bottom 속성text속성과 속성값font의 종류 , font의 속성# 노트정리 :색깔과 관련된 속성과 속성값 & margin - left/fright/bottomText 관련 속성font 관련 속성, 속성값○ 요약 :● 색깔(Color)1_ Color에 관련된 속성 종류(3가지) : color //글 색깔 , background - color , border - color //테두리 색깔2_ Color의 속성값 종류 (3가지) : 색깔이름 , #rrggbb //8진수, rgb(10진수, 10진수, 10진수)● 박스에 대한 margin- top / left / right / bottom 속성1_ margin 적용 없는 기본 를.. 2024. 10. 3.
(20)명품 웹프로그래밍 4장_CSS_3 # 범위 :특정 태그의 CSS 적용 방법 (3가지) : 태그 이름 셀렉터 , 태그의 class속성 , 태그의 id속성셀렉터의 종류(4가지) : 부모,자식,자손 셀렉터 , 전체 셀렉터, 가상 클래스 셀렉터# 노트정리 :특정 태그의 CSS 적용 방법 (3가지) : 태그 이름 셀렉터 , 태그의 class속성 , 태그의 id속성셀렉터의 종류(4가지) : 부모,자식,자손 셀렉터 , 전체 셀렉터, 가상 클래스 셀렉터○ 요약 :1_ 특정 태그에 CSS 적용 방법 3가지방법_①. 셀렉터 이름으로 CSS 적용방법_②. 태그의 class 속성으로 CSS 적용순서1) 태그의 class 속성의 속성값으로 속성명 지정순서2) 시트 내에 공식1 || 공식2 로 CSS 적용공식1 : 태그명.class속성값(class명)공식2 : .. 2024. 9. 30.

티스토리툴바