본문 바로가기
반응형

Web/CSS4

CSS는 왜 적용이 안될까? 오류 점검 4가지  선택자의 논리족 오류 : (class ="description"이라고 클래스 만들고 style시트에. descrptin이라고 설정하는 경우        즉 오타 일경우 ) 코드를 올바르게 저장했는지 점검 : 저장을  올바르게 하지 않았다  =  ctrol+s를 저장  아니면 설정에 들어가서             auto   save를 활성하 시켜준다.CSS파일이 제대로 연결 되었는지 점검 : 외부 CSS 사용할 때 link태그에 잘 넣어줘야 한다.  내부일 때는 style태그     안에    잘 들어가 있는지 점검   즉 오타 주의  CSS스타일 우선 순위 : 우선순위를 높여 주면 된다. CSS 우선 순위 - 웹 페이지에서 스타일이 적용되는 순서를 결정하는 규칙우선순위 ! impor.. 2024. 8. 4.
블록 레벨 요소 & 인 라인 레벨 요소 , 박스 모델의 기본 구성 블록 레벨 요소 (block-level element) 태그를 사용해 삽입했을 떄 , 혼자 한 줄을 차지하는 요소 입니다. 한줄을 차지한다는 것은 width가 100%라는   의미 입니다.width,margin,height 속성을 정의하면 블록 레벨 요소는 모두 적용 됩니다.화면 구성이나 레이아웃을 짤 때는 레벨 요소 사용 가능합니다. 인라인 레벨 요소(inline-level element)인라인 레벨 요소는 줄을 차지하지 않는 요소 입니다. 즉 화면에 표시돠는 콘텐츠 만큼만 영역을 차지하고 나머지 공간에는 다른 요소가 올 수 있습니다. 한 줄에 여러 개의  인라인 레벨요소를 표시할 수 있다. margin- 상하 적용 X -> line-height로 조정 가능 합니다.width, height 적용 X(인.. 2024. 8. 4.
flex Box(개념 -container 적용 되는 속성들 ), 중심축 Flex Box (Flexible Box Module )→행과 열 형태로 항목 무리를 배치하는 일차원 레이아웃 메서드 입니다.레이아웃(layout -배치):컴퓨터 그래픽 디자인이나 소프트웨어 디자인에서 각 구성요소를 제한된 공간 안에                                     효과적으로배열하는 일  기본축 (main axis) :  flex item 배치되고 있는 방향 (main start, main end) = 페이지를 가로지는 행 - 중심 축 교차 축(cross axis) : 내부에  배치되는 방향에 직각을 이루는 축(cross start,cross end) -반대 축   flex item :  Flex Container  구성요소  Cotainer에 적용 되는 속성수평 정렬  .. 2024. 7. 29.
CSS 란 ??? CSS( 캐스케이딩(Cascading) + 스타일 시트(Style Sheets))  → 웹 페이지를 꾸며주는 코드입니다.캐스케이딩 →폭포(위에서 아래로 쏟아지는 의미를 가진 영어단어 )    캐스케이딩 스타일 시트 →  위에서 아래로 적용되는 스타일 시트 왜 케스 케이딩 중요한가?????      Html/Css를 사용하다 보면  한 태그에 여러 스타일이 겹쳐지는 경우가  발생된다. 이럴 경우에 어떤 스타일요소를      우선적용할지 결정하는 것이 캐스케이딩입니다. 그렇기 때문에 케스케이딩 개념에 대한 이해가 필요합니다.     케스케이딩 원칙 2가지      1.스타일 우선순위      2. 스타일 상속 1. 스타일 우선순위 원칙→우선순위에 따라 스타일이 적용되는 것을 말한다. 우선 순위 3가지    .. 2024. 7. 26.
반응형