- 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版）
- Moodle Administration Essentials
- JavaScript+DHTML語法與范例詳解詞典
- Designing Hyper-V Solutions
- PHP 編程從入門到實踐
- ADI DSP應用技術集錦
- 51單片機C語言開發教程
- 常用工具軟件立體化教程（微課版）
- JavaScript程序設計（第2版）
- JavaScript+jQuery網頁特效設計任務驅動教程
- Ext JS 4 Plugin and Extension Development
- 快樂編程：青少年思維訓練
- Unity虛擬現實開發圣典
- C++ Data Structures and Algorithm Design Principles
- 前端程序員面試筆試真題與解析