首页 > 其他分享 >ul li水平垂直布局

ul li水平垂直布局

时间:2022-12-15 17:35:13浏览次数:62  
标签:lower 标记 li 垂直 ul 片假名 alpha block

li 属性方法

ul {

list-style-type: none;

padding: 0;

}

li {

display: block;

margin: 0 10px;

}

display:block(块级元素 )

会独占一行,多个block元素会各自新起一行。默认情况下,block元素宽度自动填满其父级宽度

display:inline(内联(行级)元素 )

不会独占一行,多个相邻的行内元素会排列在同一行里,直到一行排列不下,才会新换一行,其宽度随元素的内容而变化

display:inline-block

既具有block的宽度高度特性又具有inline的同行特性

《ul-- list-style-type》 列表样式

none 无标记。
disc 默认。标记是实心圆。
circle 标记是空心圆。
square 标记是实心方块。
decimal 标记是数字。
decimal-leading-zero 0开头的数字标记。(01, 02, 03, 等。)
lower-roman 小写罗马数字(i, ii, iii, iv, v, 等。)
upper-roman 大写罗马数字(I, II, III, IV, V, 等。)
lower-alpha 小写英文字母The marker is lower-alpha (a, b, c, d, e, 等。)
upper-alpha 大写英文字母The marker is upper-alpha (A, B, C, D, E, 等。)
lower-greek 小写希腊字母(alpha, beta, gamma, 等。)
lower-latin 小写拉丁字母(a, b, c, d, e, 等。)
upper-latin 大写拉丁字母(A, B, C, D, E, 等。)
hebrew 传统的希伯来编号方式
armenian 传统的亚美尼亚编号方式
georgian 传统的乔治亚编号方式(an, ban, gan, 等。)
cjk-ideographic 简单的表意数字
hiragana 标记是:a, i, u, e, o, ka, ki, 等。(日文片假名)
katakana 标记是:A, I, U, E, O, KA, KI, 等。(日文片假名)
hiragana-iroha 标记是:i, ro, ha, ni, ho, he, to, 等。(日文片假名)
katakana-iroha 标记是:I, RO, HA, NI, HO, HE, TO, 等。(日文片假名)

作者:rightmost
链接:https://www.jianshu.com/p/c7e9375ba185
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

标签:lower,标记,li,垂直,ul,片假名,alpha,block
From: https://www.cnblogs.com/trimphNuan/p/16985628.html

相关文章

  • jdk 8等份分割list
     publicstaticvoidmain(String[]args){List<Integer>list=newArrayList<>();list.add(1);list.add(2);list.add(3);......
  • lightProxy代理设置
    LightProxyhttps使用如何导入自定义证书,抓HTTPS请求1,需要把证书文件导入到自定义证书目录下》目前获取的证书格式是.key和.pem一对的》一起复制到对应目录下......
  • 深度学习入门No module named 'common'问题
    这⾥的“common”模块是源代码中作者⾃⼰写的,将下载的源⽂件夹“【源代码】深度学习⼊门:基于Python的理论与实现”改名为book_code,并且将sys.path.append(os.pardir)#......
  • liunx 系统 mysql 登录初始化
    1.初始化密码登录1.1查看初始化密码: 输入指令  #cat/var/log/mysqld.log日志记录里有初始化密码,复制密码保存登录数据库再修改 ......
  • 基于云原生的集群自愈系统 Flink Cluster Inspector
    作者:舟柒、楼台1.业务背景与挑战1.1实时计算集群现状关于热点机器处理一直是阿里云Flink集群运维的一大痛点,不管在日常还是大促都已经是比较严重的问题,同时这也是分布......
  • eclipse使用git提交项目
    eclipse使用git提交项目有2种方式:一种是git命令窗口,另一种是eclipse自带git插件(跟svn插件一样使用)一、使用git命令窗口提交项目1.首先官网下载git并安装,然后配置用户信息(任......
  • ocelot + consul 保姆级快速上手及遇到的坑,只讲步骤不讲原理
    本文只讲步骤不讲原理,先搭建成功再自行找资料看具体配置是什么意思!环境:win10,vs2022,.net6,neget包(Ocelot和Ocelot.Provider.Consul皆为18.0.0版本,Consul1.6.10.8版本),co......
  • 嵌入式数据库 sqllite & h2  utils
    使用场景:简单脚本,但是有需要数据记录.(使用前升级下版本)     我的使用:老机器,老项目,jkd6, 需要记录 SqlLiteUtilspackagecom.icil.edi.listener......
  • Docker下/var/lib/docker/overlay2空间清理办法
    Docker下/var/lib/docker/overlay2空间清理办法Docker下/var/lib/docker/overlay2空间清理办法1.查看磁盘占用   df-h2.Docker的内置CLI指令doc......
  • JavaconfigApplicationTests
    packagecom.example.demo;importcom.example.demo.config.JavaConfig;importcom.example.demo.model.Printer;importorg.junit.Test;importorg.junit.runner.Ru......