【HTML만으로 OK】class/id 필요없음의 초간편하고 경량인 CSS를 이용한다
소개
"bootstrap"으로 대표되는 CSS 프레임은 매우 편리하기 때문에 이용해 왔습니다. 평소부터 쓰러뜨리고 있어, 이미 몸에 붙었다, 라고 하는 분이면 문제 없다고 생각합니다만, 가끔 밖에 사용하지 않는 나와 같은 것에 있어서는, 지정하는 class를 조사하면서 지정해 가는 것은 조금 귀찮은 그렇다고 생각했습니다. (간단한 HTML을 만들 때 등은 특히 그렇게 생각했습니다)
class나 id를 지정하지 않아도 좋은 방법이 있다는 것을 알았으므로 시도해 보았습니다.
classless CSS framework 라고 합니다.
준비하는 것은 HTML만으로, class/id의 지정은 필요 없습니다. 어쨌든 간단하고 HTML의 head 태그에 한 줄 추가하는 것만으로 좋은 느낌을줍니다.
htps : // 기주 b. 이 m/x·네 w. cs
htps : // an dyb 될 수 r. 기주 b. 이오/mvp/
①new.css
추가할 코드
sample.html<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@exampledev/new.css@1/new.min.css">
</head>
데모 사이트
htps // // wcs. 네 t/하지만/
npm/yarn에도 대응하고 있다.
npm i @exampledev/new.css
yarn add @exampledev/new.css
또, 테마도 있어 나이트 모드나 터미널 모드가 있어, 폭속으로 변경·적용이 가능.
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@exampledev/new.css@1/new.min.css">
</head>
samle.html
<head>
<link rel="stylesheet" href="https://newcss.net/theme/night.css">
</head>
sample.html
<head>
<link rel="stylesheet" href="https://newcss.net/theme/terminal.css">
</head>
터미널 테마를 적용한 샘플 사이트는 여기
②mvp.css
추가할 코드
sample.html<head>
<link rel="stylesheet" href="https://unpkg.com/mvp.css">
</head>
데모 사이트
htps : // an dyb 될 수 r. 기주 b. 이오/mvp/
샘플 사이트는 여기
요약
<head>
<link rel="stylesheet" href="https://unpkg.com/mvp.css">
</head>
덤
CSS 프레임워크를 적용하고 확인하는 것은 반응형에 대응할 수 있는지 여부라고 생각합니다. 동시에 장치를 확인하는 사이트 도구는 여기가 편리합니다. (ID 등록 등은 불필요)
everysize
htps : // 에ゔぇ ry하자. 키바 bs. 코m/
참조 URL
new.css
new.css
mvp.css
Reference
이 문제에 관하여(【HTML만으로 OK】class/id 필요없음의 초간편하고 경량인 CSS를 이용한다), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/yoshi_yast/items/8083caa4f86db4e81a50텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)