栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 生活办公 > 软件使用

HBuilderX设置div标签分栏显示步骤分享

软件使用 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

大家在设计网页时为了达到更好的显示效果,一般都会使用css3的属性来进行div标签分栏设计,一些新上手的小伙伴还不清楚具体的操作步骤,下面就跟着小编一起来看看实现方法吧。

HBuilderX实现div标签分栏显示方法

第一步,打开HBuilderX工具,创建web项目,然后新建文件


HBuilderX设置div标签分栏显示步骤分享

第二步,在标签中,插入三个div标签,分别设置不同的内容


HBuilderX设置div标签分栏显示步骤分享

第三步,利用one和two ID选择器,设置对应的样式属性


HBuilderX设置div标签分栏显示步骤分享

第四步,保存代码并运行页面文件,打开浏览器,查看界面效果


HBuilderX设置div标签分栏显示步骤分享

第五步,再次添加设置第三个div标签的样式,分别添加background-color属性


HBuilderX设置div标签分栏显示步骤分享

第六步,再次保存代码并刷新浏览器,可以看到界面出现了分栏


HBuilderX设置div标签分栏显示步骤分享

想看看还有什么软件适合自己吗?那就来考高分网软件教程频道看看吧,这里有详细的教程和攻略,总有一篇符合你的心意。

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/931288.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号