HTML CSS

css 기초 다잡기.

GABOJOK 2023. 6. 12. 05:39

 

이미지 가운데 정렬

display: block;

margin-left: auto;

margin-right: auto;

 

 

글자 가운데 정렬

text_align : center;

 

글자 글자간 간격 조정

<h2 style = " letter-spacing: 10px; "> 춘식이</h2>

 

글자 굵게

style = " font-weight: 굵기 설정하기." 

혹은 

span태그로 감싼 글자만 굵게 하려면 strong태그로 바꿔준다. 

 


CSS파일 링크로 걸어두기.

<link href = "css 파일의 경로" rel = "stylesheet">

 

rel 은 지금 이 링크거는애 작업하는 애랑 어떤 관계인지 말해주는거

파일의 경로를 적을때 파일이 작업폴더 안에 파일로 존재한다면 그냥 파일명만.

그렇지 않고 작업 폴더 안에 다른 폴더로 존재한다면 폴더명/파일명 이렇게.

경로에 따라서 달라짐. 

 

 

 

 

 

 

display:block을 기본적으로 가지고 있는 태그들

div, p, h1~6

 

 

css는 inherit(상속) 기능을 가지고 있다. 

부모태그에 어떠한 것을 지정해서 하면, 자식태그도 영향을 받는다. 

 

 

 

 

box-shadow   박스에 그림자를 주는 기능.  

퍼온곳 (https://hianna.tistory.com/753)

box-shadow: 5px 5px 5px 5px gray;

오른쪽으로 5px, 아래쪽으로 5px, 5px의 블러를 추가,  5px만큼 크기를 늘림. 색깔은 gray로.

 

box-shadow: inset 5px 5px 

그림자의 방향을 안쪽으로