'coding/html + css' 카테고리의 글 목록 (13 Page)

[css] linear-gradient 반반무많이 2탄

안녕하세요. 플입니다. liner-gradient를 사용할 때 주의할 점이 있어서 2탄으로 돌아왔습니다. 1. liner-gradient https://ssimplay.tistory.com/239 [css] 배경색 반반 무많이 안녕하세요. 플입니다. 오늘은 배경색을 반씩 나눠서 두 가지 색으로 만들어볼게요. 1. 크기 정하기 이렇게 이미지가 색 경계에 걸쳐있을 때가 있어요. 코딩 안된다고 시안을 막 뜯어고치는 건 너무 슬프잖아요?.. ssimplay.tistory.com 배경색 반나누는 1탄은 링크로 남겨둘게요. 2. 그라데이션이 되는 이유 아 퍼센트를 조정하면 두가지색으로 나눌 수 있겠군! 하고 신나서 만들었는데 그라데이션이 된 경우가 있으신가요? div{ background:linear-gradien..

coding/html + css · 2020. 4. 20. 07:30

[css] 눈누 웹폰트 적용하기

안녕하세요. 플입니다. 오늘은 눈누에서 웹폰트를 적용해볼게요. 1. 눈누 https://noonnu.cc/ 상업적 이용 가능한 무료 한글 폰트 모음 사이트 눈누 상업적으로 이용할 수 있는 무료 한글 폰트를 모아 놓은 사이트 눈누 noonnu.cc 눈누는 상업적 이용이 가능한 한글 폰트 모음 사이트예요. 우선 위의 링크로 들어가 폰트를 골라줍니다. 스크롤을 내려서 원하는 폰트를 찾아도 좋지만 딱 원하는 폰트가 정해져 있다면 검색하는 게 편할 거예요. 검색하기 위해서 상단 메뉴에서 모든 폰트를 선택합니다. 모든 폰트 메뉴로 들어오면 오른쪽 상단에 검색할 수 있는 창이 뜰 거예요. 원하는 폰트를 검색해줍니다. 저는 나눔 시리즈를 원해서 나눔이라고 검색할 거예요. 2. 웹폰트 적용 원하는 폰트를 찾았다면 폰트를..

coding/html + css · 2020. 4. 16. 07:30

[css] 배경색 반반 무많이

안녕하세요. 플입니다. 오늘은 배경색을 반씩 나눠서 두 가지 색으로 만들어볼게요. 1. 크기 정하기 이렇게 이미지가 색 경계에 걸쳐있을 때가 있어요. 코딩 안된다고 시안을 막 뜯어고치는 건 너무 슬프잖아요? 심지어 내가 만든 시안이 아닐 때는 더욱더 난감하겠죠. css3가 된 뒤로는 코딩으로도 만들 수 있으니 배경을 나눠봅시다! .visual{ height:1000px; border:1px solid red; } 먼저 배경이 들어갈 영역의 크기를 정해주세요. 저는 한 1000px 정도 줬고요. 테두리는 아래가 흰색이라 잘 보이라고 넣어줬습니다. 테두리는 없어도 괜찮아요. 2. linear-gradients .visual{ background: linear-gradient( #fff5bf 80%, #fff..

coding/html + css · 2020. 4. 14. 07:30

[html] figure 활용하기

안녕하세요. 플입니다. 태그를 활용해볼게요. 1. figure 는 보통 이미지, 영상 등을 올릴 때 사용하는 태그예요. 태그랑은 다르게 설명을 넣을 때 주로 사용하죠. 설명을 넣을 때는 태그를 사용해요. 20.01.27 포그 귀엽다. 로그원 보자. 코드를 보면 크게 태그로 감싸주고 안쪽에 태그와 태그를 사용한 걸 알 수 있어요. 태그는 html5에 추가된 태그인데요. 조금 더 구체적으로 그룹 지을 수 있는 태그들이 많이 나오는 것 같아요. 이 전에는 나 태그를 많이 사용해 유지보수가 어려웠다면, html5에서는 다른 태그들이 많이 나와서 유지보수가 수월해지고 있다고 느껴요. 태그에 비해 태그를 사용하면 아, 여기에는 이미지가 있겠구나 하고 한 번에 알 수 있으니까요. 자식 태그를 한 번 더 체크하지 않아..

coding/html + css · 2020. 3. 27. 07:30

[css] 최우선 적용

안녕하세요. 플입니다. css 선언 방법 중 최우선 적용되는 방법은 어떤 방법일까요? 1. inline inline 방법은 html에서 태그에 직접 style을 입력하는 방법이에요. 태그에 직접적으로 입력해서 가장 최우선으로 적용돼요. 다만 유지보수가 힘들어서 권장하는 방법은 아니에요. html 코드가 길어지면 style 하나를 고치기 위해 엄청 긴 코드를 일일이 뒤져야 할 테니까요. 2. intermal inline보다 유지보수가 수월한 internal 방법이에요. p{ color:yellow; } external 방식은 가장 권장하는 방식이에요. 태그에 css파일을 연결해서 불러오는 방식이라 html 문서에서 style을 작성할 필요가 없어요. css 파일을 새로 만들어서 필요한 html문서에 연결만..

coding/html + css · 2020. 2. 13. 07:30

coding/html + css 101