본문 바로가기

WEB

(75)
bootstrap5 공부해서 웹페이지 만들기(구구단표) 3 5. Table 기존 테이블 태그 table, thead, tr, th, tbody, tr, td를 사용 table : table 태그에 사용하는 클래스 속성 table-striped : 줄무늬 table-bordered : 테두리 table-hover : 마우스를 올리면 백그라운드 색이 변함 table-borderless : 모든 테두리 제거 table-primary, table-success ... 같은 색들은 table 태그, tr 태그, td 태그에 적용할 수 있다. 테이블을 하니 예제를 안할 수 없다. 바로 구구단 도안 만들기 아.. 만들려고 하는데 반복되는 태그가 많아서 자바스크립트를 써야할 것 같다. js 튜토리얼에서 loop문만 w3c school에서 훑어보고 만들면 된다. 뭔가 맛있어보이..
bootstrap5 공부해서 웹페이지 만들기 2 모바일 화면이 더 작기 때문에 bootstrap5는 모바일 화면을 우선으로 한다. bootstrap5는 class 속성으로 이미 만들어 놓은 CSS들을 사용할 수 있다. 1. wrap container : 고정 너비의 wrap container-fluid : 꽉찬 너비의 wrap -sm, -md, -lg, xl, xxl 같은 옵션으로 wrap을 사용자에 맞게 쓸 수 있다. 2. flexbox 한 페이지는 총 12개의 칼럼으로 나눠져 있다. row : 행 col : 칼럼 -sm-, -md-, -lg-, -xl-, -xxl- wrap과 같은 옵션 -2, -3, -4, ... -12 한 칼럼이 많은 자리를 차지할 수 있다. 3. Typography h1, h2, ... h6 : html5의 에서 태그를 대신한..
bootstrap5 공부해서 웹페이지 만들기 1 CentOS Linux 7 : OS Visual Code : editor HTML, CSS3, javascript : lang bootstrap5 : framework vncviewer를 이용해 리눅스에서 진행할 생각이다. editor는 비주얼 코드를 사용한다. 비주얼 코드 설치 비주얼코드 홈페이지에서 rpm 파일을 설치 후 yum으로 install 해준다. 터미널에서 code를 쳐보면 비주얼코드가 실행된다. 확장에서 한글을 설치하고 /var/www/html 폴더를 열었다. 공부는 bootstrap5 튜토리얼로 하면된다. https://www.w3schools.com/bootstrap5/index.php Bootstrap 5 Tutorial W3Schools offers free online tutori..