html里的其他标签（3）

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第1天，点击查看活动详情

上一期的更文挑战中做出了一个文本输入框和密码输入框，距离想要实现的简单登陆界面还差一个登录按钮，今天先来实现登录按钮。

登录按钮的写法

1. 使用 input 单标签，设置属性 type="button"

<input type="button" value="登陆">

2. 使用 input 单标签，设置属性 type="submit"

<input type="submit" value="登陆">

3. 使用button 双标签，无需设置属性，双标签内部的内容写登陆即可

<button>登陆</button>

以上就是登录按钮的三种写法，再将登录按钮和账号密码的输入框组合起来就可以得到一个简单的登录界面了，效果如下：

再次尝试这个界面

需要使用到部分css（近期学习了部分css内容，后期会更新在一个css专栏中，需要了解可以关注后续文章更新）

前几天下载了Photoshop软件可以进行切图，对每一项之前的符号进行裁取。

先进行中间部分（资讯、体育、天气、查看更多部分的制作）

1. 把这一部分的内容放进一个 div 盒子中
2. 用Photoshop量取该部分内容的宽高
3. 该部分上下有灰色线，可以对 div 盒子指定上下边框
4. 将每一行的内容放进一个新的 div 盒子中，每一行所占高度相同
5. 在每行文字对应的 div 盒子中按顺序先放置符号图片，再放置文字

最终得到下面的样子，文本部分应该在每一行部分的居中位置，但是还没有找到调整方法，得到修改方案后会再次更新