- Cross-platform Desktop Application Development：Electron，Node，NW.js，and React
- Dmitry Sheiko
- 78字
- 2021-07-15 17:36:24
An HTML prototype
We've just reached the point where we can start templating our application. Using HTML and CSS, we will achieve the intended look and feel. Later, we will bind JavaScript modules to the acting elements.
We start by replacing the content of index.html with the following code:
./index.html
<!DOCTYPE html>
<html>
<head>
<title>File Explorer</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="./assets/css/app.css" rel="stylesheet" type="text/css">
</head>
<body class="l-app">
<header class="l-app__titlebar titlebar">
</header>
<div class="l-app__main l-main">
<aside class="l-main__dir-list dir-list">
</aside>
<main class="l-main__file-list file-list">
</main>
</div>
<footer class="l-app_footer footer">
</footer>
</body>
</html>
Here, we just defined the page layout with semantically meaningful HTML tags. As you can see, we refer to ./assets/css/app.css that we are about to create.
推薦閱讀
- 微服務設計（第2版）
- Android Wearable Programming
- Visual Basic程序設計（第3版）：學習指導與練習
- HTML5+CSS3基礎開發教程（第2版）
- Functional Programming in JavaScript
- 基于Swift語言的iOS App 商業實戰教程
- Mastering Predictive Analytics with Python
- QTP自動化測試進階
- Gradle for Android
- Domain-Driven Design in PHP
- Android群英傳
- Learning Modular Java Programming
- 汽車人機交互界面整合設計
- NGUI for Unity
- 進入IT企業必讀的324個Java面試題