본문 바로가기

웹프로그래밍43

(23)명품 웹프로그래밍 4장 실습문제(작성중) [문제1] :#알아야 할 개념 : X #코드 :12345678910111213141516171819202122232425262728293031323334!DOCTYPE html>html lang="en"> head>  meta charset="UTF-8">  title>태그 셀렉터 만들기/title>  style>    body{      background-color: linen;    }    h3{      color : blue;      text-align: right;    }    p{      color : purple;    }    span{      background-color: skyblue;    }  /style>/head> body>  h3>소연재/h3>  hr>  p>   .. 2024. 10. 4.
(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.