飞道的博客

【HTML5+CSS】怎样去美化你的页面

309人阅读  评论(0)

一、网页布局

关于网页布局,首先就是盒子(div)的合理分布,一个比较美观页面的组成必定少不了很多盒子的设定。
多个盒子的设定,会让页面布局逻辑更加清晰,而且后面做调整的时候也会更加方便,具体意思就是盒子套盒子。

二、关于文本

我们除了设置字体大小、字体颜色、与之相对应的font-family(这个词不知道怎么翻译更合适),我觉得行间距、行高、外间距的设置都是十分重要的。与页面更相对应的font-family也会让页面更加加分。

三、关于整体内容

关于整体内容之间的间距也是需要调整的,就是margin、margin-top、margin-left、margin-right。距离感会让看起来更加美观

四、关于调整div

因为每个盒子都是可以自己独立设置样式,但是盒子我们看不见,在写了很多样式之后,就会看不出明显效果,这时候加上一个border,使它有了边框,不同盒子边框可以设置不同颜色,更加方便设置。在设置完成时候,删除就可。

五、关于输入框

同样是间距的问题(框与框之间的距离),十分重要,以及边框弧度的设置、输入框的高度、宽度的设置。这些都会使得输入框更加美观。

六、导航栏

导航栏的话,不要过宽或者过高,内容也尽量做到格式规范一致,不要过长,否则会很难看。

七、背景颜色

首先不管是设置了几个盒子,div,首先背景颜色的色调要统一,就算是导航栏,在设置背景颜色,与之相近相符合的颜色。合适的背景颜色会极大提升舒适感。但是也不要乱用,否则效果反之。

后来想起来啥再补充吧,儿童节happy!

制作人:只识闲人不识君

日期:2020.06.01


转载:https://blog.csdn.net/weixin_46069678/article/details/106472097
查看评论
* 以上用户言论只代表其个人观点,不代表本网站的观点或立场