목록전체 글 (98)

코딩응애의 개발블로그

드림코딩 유튜브 클론코딩 보고 새로 알게된점 + α

text-transform css에서 대문자로 또는 소문자로 바꾸는 속성 기본값은 none uppercase : 모든 글자를 대문자로 바꾼다 lowercase : 모든 글자를 소문자로 바꿉니다. .channel .sub2 { text-transform: uppercase; } /* 사용하는 예시 */ 텍스트 여러줄 ... (생략) 으로 하기 .ellipsis { width: 200px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } text-overflow: ellipsis; 를 이용해서 생략을 해야하는데 이 문장 하나 만으로는 생략이 안..
HTML CSS 2021. 11. 14. 16:03
드림코딩(유튜브 클론코딩 하면서 처음알게된것들 정리 )

태그 사이트 네비게이션이나 페이지에 대한 정보를 담는 태그 페이지 상단에 위치한다. 보통 하나 이상의 제목 요소(h1~h6)나 사이트 로고, 저작권 정보를 포함. 웹페이지나 특정 글 영역 등 해당 부분의 머리글 역할을 한다. 헤더 내부에는 네비게이션 태그를 사용하기도 함 Home Gallery 태그 보통 제목을 나타내는 태그들을 포함하고 있음 (h1~h6) 자식요소로 포함됨 주제별 영역들을 그룹화 하기위해 사용한다. section요소를 사용하는 예로는 챕터나 탭으로 구분된 대화상자에서 탭된 페이지 논문의 번호가 매겨진 섹션. 홈페이지에서는 소개 뉴스 아이템 연락처 등이 섹션으로 분리 될수 있다. CSS :root :root 가상 선택자라고 한다 마치 클래스 처럼 동작해서 이 각각에 element에 상태에..
HTML CSS 2021. 10. 24. 12:02
드림코딩 (웹사이트 따라 만들기, 반응형 헤더편) + 생활코딩

강의 들으면서 처음 알게된거 정리했습니다 li 태그 점 없애기 하하 정준하 li 태그를 쓰면 이러한 점이 앞에 생기는데 이 점을 없애는 방법은 . . . 하하 정준하 테두리 경계를 둥글게 만드는 법 마우스를 위에다 올렸을때 뭔가를 해주려면 hover를 이용하는데 여기서 배경색깔을 바꾸는데 이런식으로 테두리가 각져 있을때 이 테두리를 둥글게 만들려면 border radius : ?px; 이런식으로 해주면 된다 물론 스타일 태그 안이나 css에서 해야됨 태그 DreamCoding Home Gallery Wedding FAQ Booking 우선 ol ul 이런 태그들은 웹페이지에서 네비게이션 역할을 한다. 이런 역할을 하는 태그를 네비게이션을 뜻하는 태그 안에다가 넣어주면 그 부분이 컨텐츠를 탐색할때 사용하는..
HTML CSS 2021. 10. 4. 15:11
비쥬얼 스트디오(vscode) 터미널 아이콘 바꾸는법

이건 진짜 몇개월간 찾다찾다 해결법을 찾아서 공유해 보려고 하는 글입니다 저의 vscode 아이콘이 뭘 잘못눌렀는지는 몰라도 어느 순간 이렇게 바뀌고 온갖 방법을 써도 바뀌지 않더군요.. 진짜 구글링이란 구글링은 다 해보고 영어로도 검색하고 지웠다가도 다시 깔아봤지만 여전한.. 그러고 시간이 흐르고 자연스레 웹 개발 쪽 공부를 하면서 vscode를 안쓰고 아톰을 쓰다가 이제 다시 본격적으로 vscode 쓰려고 다시 들어갔는데 다시 안좋은 기억이 생각나고 여전했던 그녀석.. 마지막으로 다시 해결법을 찾아보자 해서 구글링을 하다가 누군가 쓴 댓글을 보고 반쯤 포기한 마음으로 따라 했는데 아.. 그자리에서 바로 박수 쳤습니다 ㅠㅠ 겨우 찾음 이제부터 혹시나 저와 같은 고민을 하고 계시는 분들을 위해 방법을 소..
파이썬 2021. 10. 1. 22:59
드림코딩 & 생활코딩 (CSS Flex box)

* 드림코딩님 생활코딩님 강의를 듣고 제 나름 대로 정리한 글입니다. + 구글링에 도움도 받았습니다 Flex box에는 중심축과 반대축이 존재하는데 예를 들어서 수직축이 중심축이라고 한다면 수직축에 반대인 수평축이 반대축이 되는것임 그리고 수직축이 중심축이 된다는 소리는 뭐냐면 아이템들이 위에서 아래로 정렬이 되고 수평축이 중심축이 된다면 왼쪽에서 오른쪽으로 정렬이 된다는 것을 뜻함 Flex box flex box로 만들고 싶다면 display: flex; 라고 적어주면 아이템들이 왼쪽에서 오른쪽으로 정렬이 된다. 1 2 3 4 5 각종 속성값들 ( flex-direction ) flex-direction 은 기본값이 row다 flex-direction : row-reverse; 해주면 오른쪽에서 왼쪽으..
HTML CSS 2021. 9. 22. 17:56
드림코딩&생활코딩(CSS 선택자, display, position)

* 드림코딩님 강의 보고 더 궁금한게 있으면 생활코딩님 강의도 찾아보고 구글 검색해서 찾아보고 했습니다 전체 선택자 (Universal Selector) 모든 태그들을 선택한다 태그선택자 영어로는 type selector 라고 한다 (처음알았음;) state 선택자 (의사 클래스 가상 클래스 라고 한다) . . . Button 1 :hover 부분이 state 선택자 attribute 선택자 . . . Naver Google display : inline; 콘텐츠 자체만을 꾸며준다 CSS에서 width나 height 크기를 정해주어도 무시하고 콘텐츠에 크기에 맞춰서 변경이 된다 . . . . 1dfdsfdsfasdfdsafdsaf 2 3 display: inline-block; inline과 마찬가지로 ..
HTML CSS 2021. 9. 17. 17:37
생활코딩(WEB2-CSS 반응형 디자인 ~ 마무리 )

반응형 디자인 화면에 크기에 따라서 웹페이지에 각 요소들이 반응해서 최적화된 모양으로 바뀌게 하는것 미디어 쿼리 반응형 디자인을 CSS를 통해 구현 할때 필요한 개념이 미디어 쿼리이고 어떠한 조건을 만족할때만 CSS의 내용이 동작하도록 하는것이 가능하게 하는것 이것을 미디어 쿼리라고 함 . . . Responsive 코드의 재사용 여태했던 style 태그에 내용들을 다른 html에다가 똑같이 적용하려면 복사 붙여 넣기를 똑같이 해주어야 하는데 이게 지금은 페이지 수가 적어서 할만 하지만 엄청나게 많아진다면 아마 할맛이 안날것이다 이러한 중복을 없애기 위해서 새로운 파일 예를들어 style.css 라는 파일을 만들고 그 안에다가 style 태그에 내용을 복사 붙여넣기 해주고 html로 돌아와서 style ..
HTML CSS 2021. 9. 5. 19:40
8월 23일

오늘 한일 오늘은 생활코딩님 CSS 강의를 들었다 느낀점 점점 흥미가 다시 생겨나는것 같아서 기분이 조금 좋다
오늘 한일 +느낀점 2021. 8. 23. 23:31
Prev 1 ··· 8 9 10 11 12 13 Next