HTML排版怎么实现元素横向放置?

HTML排版怎么实现元素横向放置?,第1张

Dreamweaver新建一个HTML文件——修改title为html+css——新建一个div  id为“a”——设置代码,给li设置左浮动效果。

具体步骤:

1、用Dreamweaver新建一个HTML文件

2、修改title为html+css实现横向导航

3、新建一个div  id为“a”,添加ul li标签

4、在li中添加自己想要的文字 并调整好文字间距,按F12预览,如下图所示

5、首先去掉字体前面的小黑点,代码如下:

6、接下来,使文字横向排列,设置代码如下,给li设置左浮动效果

7、按F12预览,效果如下

添加 float:left即可横向排列。

添加 display: flex即可横向排列。当设置 display:flex时, float:left会失效。

看你截图,li应该是已经实现横向排列了,只是宽度不够,导致字体竖向显示了。给li设置宽度应该就可以了


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7245494.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-03
下一篇 2023-04-03

发表评论

登录后才能评论

评论列表(0条)

保存