发帖
13 2 1

今天给毛坯网页做了精装修

花花
金牌会员

25

主题

17

回帖

2380

积分

金牌会员

积分
2380
爱星物联IoT云平台 1757 13 2024-3-7 17:34:27
本帖最后由 花花 于 2024-3-7 17:34 编辑

戏接上集,上集我们采用复制-粘贴的方式通过组件库创建了界面,本集分享下如何调整样式美化页面,增强用户视觉体验。

图片1.png
访问地址

图片2.png

在样式这部分的技术,此项目采用的是LEES语言,LESS语言是什么呢?看看官网怎么说:

图片3.png
它是CSS,只是多了一点东西。。。
图片4.png

问题又来了,CSS是什么呢?

级联样式表css)是一种描述 HTML 文档样式的语言描述应该如何显示 HTML 元素。

没了解过的盆友们,查阅下CSS语言学习教程哈~

会不会有盆友问:什么是HTML 元素呢?

CSS语法:

图片5.png

直接上示例:

1、设置页面占整屏高度
图片6.png

图片7.png 图片8.png


2、给内容添加左右内边距
图片9.png

图片10.png


3、让按钮固定在页面底部
图片11.png
图片12.png


4、让图片左右居中对齐
图片13.png
图片14.png


5、调整单元格的内边距
图片15.png
图片16.png


6、给导航栏增加上下内边距
图片17.png
图片18.png


此时,一个还算规整的页面就成型了,CSS还有很多其他属性,可根据教程按己所需去使用。遇到难题的盆友,欢迎留言交流呐~

图片19.png

──── 2人觉得很赞 ────
图片19.png

使用道具 举报

2024-3-8 08:14:41
2024-3-8 08:46:50
2024-3-8 08:51:42
对云平台感兴趣的同学可以学起来!
2024-3-8 08:57:37
2024-3-8 09:23:07
2024-3-8 09:31:51
厉害
2024-3-8 11:12:06
2024-3-8 12:32:52
赞一下
2024-3-8 14:09:15
您需要登录后才可以回帖 立即登录
高级模式
12下一页
统计信息
  • 会员数: 28275 个
  • 话题数: 40255 篇