十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
表示和当前li同级的所有li标签。不包括父级li和子级li。
专注于为中小企业提供成都网站制作、成都网站设计服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业民勤免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了上1000+企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。
另外常用的还有lili:这个表示当前li的子级li标签。
li标签的css样式名称是current
其中要说明的就是楼上说的有点小问题,li是dw的默认标签所以不需要调用class,直接设置完css之后li即可生效。不过它控制的是所有的li.如果要控制单个要分开定义css样式,然后再用class或id调用.
1、利用Dreamweaver新建一个html页面。
2、在body里面输入代码
ul
li你好/li
li小鱼/li
li小小/li
/ul。
3、默认的样式是这样的。
4、编辑li标签的css样式。
5、float:left代表的是元素左对齐。这样li标签就可以横排显示了,list-style:none用来去除li标签前面的小圆点。
将li的样式设置成以下例子:display:inline;line-height:24px;height:auto;word-break:break-all;word-wrap : break-word ;可以修改一下,到适合你的要求。
HTML部分:
div id="nav"
ul
liAAAA/li
liBBBB/li
liCCCC/li
liDDDD/li
liEEEE/li
liFFFF/li
/ul
/div
css部分:
#nav{
margin: 0 auto;
border: 2px solid #00CED1;
}
ul,li {
margin: 0px;
padding: 0px;
list-style: none;
}
ul{
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
li{
border: 1px solid;
width: 100px; /*每个元素的初始化宽度*/
text-align: center;
margin-top: 10px;
margin-bottom: 10px;
flex:auto; /*这是关键*/
}
扩展资料:
Flex是Flexible Box的缩写,用来为盒装模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。
采用Flex布局的元素,被称为Flex容器(flex container),简称“容器”。其所有子元素自动成为容器成员,成为Flex项目(Flex item),简称“项目”。
容器默认存在两根主轴:水平方向主轴(main axis)和垂直方向交叉轴(cross axis),默认项目按主轴排列。
main start/main end:主轴开始位置/结束位置;
cross start/cross end:交叉轴开始位置/结束位置;
main size/cross size:单个项目占据主轴/交叉轴的空间;
设置在容器上的属性有6种。
flex-direction
flex-wrap
flex-flow
justify-content
align-item
align-content
在ul标签下li的默认样式为一个实心圆(disc) 可忽略不写
li样式的改变是用 list-style:属性值 来改变的
我们给li设置css,去除默认样式(实心圆)
将li的样式设置为空心圆
将li的样式设置为实心正方形
其他:
decimal : CSS1 阿拉伯数字
lower-roman : CSS1 小写罗马数字
upper-roman : CSS1 大写罗马数字
lower-alpha : CSS1 小写英文字母
upper-alpha : CSS1 大写英文字母
armenian : CSS2 传统的亚美尼亚数字
cjk-ideographic : CSS2 浅白的表意数字
georgian : CSS2 传统的乔治数字
lower-greek : CSS2 基本的希腊小写字母
hebrew : CSS2 传统的希伯莱数字
hiragana : CSS2 日文平假名字符
hiragana-iroha : CSS2 日文平假名序号
katakana : CSS2 日文片假名字符
katakana-iroha : CSS2 日文片假名序号
lower-latin : CSS2 小写拉丁字母
upper-latin : CSS2 大写拉丁字母