본문 바로가기

LEARN190

[HTML] selector 선택자 (tag, class, id) + style 💾 Editor: VSCode 👉 기존 html 코드 devje Front-end Developer I want my dream to come true. The future is mine. 기존 html 코드에서 style 속성으로 넣었던 것을 모두 style.css 로 옮긴다. html 파일 안에 html과 css를 연결하는 link 태그를 head 안에 작성한다. 👉 index.html => style.css (스타일 속성 옮기기) index.html style.css .profile { width:100px; display:block; margin-left:auto; margin-right:auto; } img 태그에 class 속성 추가 style.css 파일에 코드 옮기기 html 태그에 sty.. 2022. 12. 28.
[부스트코스] 웹 접근성의 이해 1. 웹 접근성의 이해 1) 웹 접근성이란 웹에서의 '접근성'이란? 웹에 잘 접근할 수 있는지 없는지의 정도를 의미 어떠한 사용자(장애인, 노인 등)가 어떠한 기술환경에서도 전문적인 능력 없이 웹 사이트에서 제공하는 모든 정보에 접근할 수 있도록 보장하는 것 모든 사용자가 모든 기기에 접근할 수 있도록 하는 것 왜 접근성을 지켜야 하는가? 장애인차별금지법 (장차법) 전자정보 및 비전자정보에 대하여 장애인이 비장애인과 동등하게 접근·이용할 수 있도록 수화, 문자 등 맆ㄹ요한 수단 제공 2) 장애 환경 웹의 힘은 보편성에 있다. 장애에 구애 없이 모든 사람이 접근할 수 있도록 하는 것이 웹의 필수 요소다. _ 팀 버너스 리 장애 어떤 사물의 진행을 가로 막아 거치적거리게 하거나 충분한 기능을 하지 못하게 함.. 2022. 12. 27.
[JavaScript] 챗봇 내 스크롤링 기능 on/off K사의 챗봇에는 2가지가 있다. K사의 기본 챗봇과 고객사의 요청이 있을 시, 고객사의 홈페이지에 맞게 커스터마이징 해서 사용할 수 있는 챗봇. 기본 챗봇은 어차피 톡 내에서 사용이 되기 때문에 크게 신경 쓸 것은 없다. 하지만 커스터마이징 해서 사용하는 챗봇의 경우에는 고객사의 요구에 맞게 수정되어야 할 부분들이 몇 가지 있다. 크게 어려운 부분들은 아니겠지만, 그럼에도 실제 프로젝트에서 역할을 맡아 해보니 확실히 이론으로 배우기만 하는 것보다는 얻는 게 많다고 생각했다. 개발자에게 필요한 것 중에 하나가 구글링이라고 하던데, 이번 기회를 통해 열심히 구글링을 하며 찾아낸 자료를 실제 코드 안에 삽입하기도 했다. 그 기회를 통해 "아! 이렇게 하면 되는구나!"라는 걸 살짝 맛 본(?) 것 같다. 완전히.. 2022. 12. 27.
[HTML] STYLING 웹페이지 스타일링 💾 Editor: VSCode 🔎 STYLING 👉 text style font-size: 글자 사이즈 font-family: 폰트 종류 color: 폰트색 letter-spacing: 자간 조절 👉 강의 듣는 중 완성 devje Front-end Developer 👉 실습 :: 소개글 알아서 완성 devje Front-end Developer I want my dream to come true. The future is mine. 이번 강의에서는 태그 내에 style 속성을 넣어서 스타일링 하는 실습을 했다. div 태그 활용해서 프로필 이미지와 텍스트 뒤에 백그라운드 컬러를 넣었다. 컬러는 gold! 그리고 mine 글자에 blue 컬러 지정! 코딩애플 공부 기록 2022. 12. 26.
[HTML] tag 태그 💾 Editor: VSCode 📢 HTML Hyper Text Markup Language 웹페이지 만들 때 사용 자료들이 어떻게 생겼나 구조를 표현하기 위한 언어 👉 index.html 생성 안녕하세요 body tag 안에 텍스트를 넣는다. 🔎 TAG 글을 적을 때는 tag 안에 적음 p(paragraph) h(heading) 실습 시작 안녕 버튼 링크 1 2 👉 정리 웹페이지를 만들 때 모든 요소는 태그 안에 넣음 일부 태그는 속성 기입 가능함 태그 안에 태그도 가능함 👉 실습 :: 글자 일부 클릭하면 웹페이지 이동 글자를 클릭하면 네이버를 새창으로 이동합니다. target 속성을 이용해 새창으로 이동하게 했다. 코딩애플 공부 기록 2022. 12. 25.
[ATOM] 아톰 단축키 (정렬, 위줄복사, html preview) 처음에 html/css 실습할 때는 아톰을 사용했었다. 한참 뒤에 VSCode를 사용하기 시작했지. 아톰을 사용하면서 꽤나 유용하게 사용했던 단축키가 3개 있는데! 혹시 몰라서 티스토리에 남기기로 한다. 정렬 ctrl + alt + B 위줄 복사 ctrl + shift + D 아톰에서 화면 보기 (html preview) ctrl + shift + H (패키지 설치한 후에 활용이 가능하다.) 2022. 12. 25.