>웹 프론트엔드 >CSS 튜토리얼 >GMX.css: 간단한 레이아웃 만들기

GMX.css: 간단한 레이아웃 만들기

Patricia Arquette
Patricia Arquette원래의
2024-12-14 09:32:10214검색

GMX.css: Create a simple layout

브라우저에는 보기 흉하고 스타일이 없는 구성 요소가 많이 내장되어 있기 때문에 간단한 웹 페이지를 만드는 것이 어려울 수 있습니다. 물론 CSS로 모든 것을 맞춤설정할 수도 있습니다. 그러나 스타일을 지정하면 시간이 낭비될 수 있으며 애플리케이션 구축에 대해 진지하게 생각하지 않게 됩니다.

머티리얼 디자인 기반의 아름다운 스타일 구성 요소가 많이 포함된 CSS 프레임워크인 GMX.css를 사용하면 웹 앱을 몇 배 더 쉽고 빠르게 구축할 수 있습니다. GMX.css로 간단한 레이아웃을 만드는 방법입니다.

먼저 CSS와 Iconify 아이콘을 가져와야 합니다. JSDelivr CDN 사용을 권장합니다.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/LIGMATV/gmx.css@main/gmx.css">
<script src="https://cdn.jsdelivr.net/npm/iconify-icon@2.1.0/dist/iconify-icon.min.js"></script>

둘째, 간편한 네비게이션을 구축했습니다. 그리고 또한 정말 반응이 좋았습니다! 데스크톱에서는 왼쪽과 세로로 표시되고, 모바일에서는 아래쪽과 가로로 표시됩니다.

셋째, 타이포그래피와 버튼이 포함된 컨테이너를 만들었습니다. 여기에서 배울 수 있습니다.

이제 GMX.css를 사용하여 간단한 웹 앱을 구축할 수 있습니다. 더 자세히 알아보려면 웹사이트를 방문하여 복사하려는 요소의 데모와 예를 확인하세요. ??
https://ligmatv.is-a.dev/gmx.css/ (소스코드)

위 내용은 GMX.css: 간단한 레이아웃 만들기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.