现在的页面超级难看，你我都知道。因为这只是一些HTML ,还是3.2版本的。如果我开始教你CSS的话就超出这本书的范围了。但是在继续之前，我想稍微加点样式让整个程序看起来好看一点。
在dist文件夹中创建名为style.css的新文件。添加一些CSS规则进去。
dist/style.css
body {
line-height: 1.428571429;
font-family: sans-serif;
}
h1 {
font-weight: 100;
font-size: 250%;
margin-bottom: 0;
color: #0275d8;
}
a {
color: #0275d8;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a.active {
color: black;
}
button {
padding: 5px 20px;
background-color: white;
margin: 10px;
border: 1px solid #aaaaaa;
border-radius: 5px;
outline-width: 0;
}
button:active {
background-color: #dcdcdc;
}
然后再在index.html中引入它：
dist/index.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div id="app"></div>
<script src="bundle.js"></script>
</body>
</html>
你要是想多添加一些CSS进去也可以，但是最好还是继续往下看吧，毕竟React才是重点，不然你可能会半途而废。
网友评论