웹개발4 CSS적용방식 / 내부스타일 시트, 외부스타일 시트, 인라인스타일 드디어 CSS 시작 ! 먼저 css의 문법 기본틀은 이렇다. 선택자{속성: 값;} ex) p{color:green;} 위 안에 있는 세 개의 문단들을 각각 다른 방식을 적용해서 글자 색상을 변경해보겠다.ㅎㅎ 글자의 색을 바꾸는 문법의 종류에는 세 가지가 있다. 내부 스타일 시트/ 외부 스타일 시트/ 인라인 스타일 1. 내부 스타일 시트 - 태그를 사용, html 문서에 바로 적용함. - 태그 내에 작성함. 태그를 태그를 사용하여 내부 스타일 시트 방식으로 변경 완료. 이 밖에 내부 스타일 시트 2. 외부 스타일 시트 (*가장 많이 사용) - 외부에 있는 .css(stylesheet 파일) 문서를 연결함. -실무에서 사용, 가장 많이 사용 -안에 외부의 .css문서 파일 링크와.. 2024. 1. 7. HTML로 로그인 창 뼈대 만들어보기 웹 사이트에 로그인 할 때 우리가 자주 마주하는 로그인 창을 지금까지 익힌 html로 만들어보기 도저어언! 완성한 코딩 ! -다른 웹사이트 계정으로 연동할 수 있는 소셜로그인 창도 만들어주고, sign in with google 이미지도 가져와서 ★ 로 바로 연결 될 수 있게 넣어주었다. ★password는 입력할 때 'for 속성값'과 'id 속성값' 이 같아야한다. (입력 시 ·······라고 입력됨) - 최종 저장하기 전에 수정을 했었나보다,,ㅎ누락된 태그를 여기에 적어보면 or Forgot your password? 이렇게 적으면 로그인 창 아래에 id/pw를 잊어버렸을 때 찾을 수 있는 링크로 연결되는 버튼을 만들 수 있다.! (아직 id/pw를 찾을 수 있는 웹은 존재하지 않.. 2024. 1. 7. 나무위키st 목록표 만들어보기 나무위키에 들어가면 보기쉽게 작성된 목록표를 구현해보고자 도전 ..! (아직 HTML만 배운 상태로 하는 거라 CSS나 JS은 적용하지 않은 상태다. 큰 틀만 짜여있는 결과물이라고 생각하면 된다.) / 과 의 구분과 경계를 명확히 하는게 조금 헷갈렸지만, 세로열로 그어진 일직선을 따라.... , 짝(?) 잘 찾아주기. / a 태그를 통해 연결 될 실제 나무위키 링크도 넣어보았다 . ㄴ그렇게 완성한 html 뼈대의 모습이다. ㄴ 이렇게 해당 글자를 클릭하면 바로 해당 페이지 링크로 연결된다. +css랑 JS 배워서 다시 완벽하게 구현하러 와야지. ^^ 2024. 1. 7. 목록 만들기 <ul,ol,dl 태그> html에서 주로 사용되는 세 가지 목록 태그에 대해서 알아보자. 1) ul 태그 -(unordered list) -순서 없는 목록 생성, 나열시 사용함. - 로 목록 내용 구성 2) ol 태그 -(ordered list) -순서가 존재하는 목록 생성 시 사용함. - 로 목록 내용 구성 오호라.. 나중에 to do list + 운동 기록 등을 할 수 있는 웹 제작할 때 사용해볼까 3) dl 태그 -dl(decription list) , dt(description term), dd(description details) 태그 사용 -정의형 목록에 사용( 용어 설명 나열) 2024. 1. 7. 이전 1 다음
