Css如何实现分类

发布时间：2021-11-23 10:21:58 作者：小新
来源：亿速云阅读：162

这篇文章主要为大家展示了“Css如何实现分类”，内容简而易懂，条理清晰，希望能够帮助大家解决疑惑，下面让小编带领大家一起研究并学习一下“Css如何实现分类”这篇文章吧。

一、尺寸操作

height 设置元素高度

line-height 设置行高

.p1{
    width: 400px;
    line-height: normal;
}

.p2{
    width: 400px;
    line-height: 200%;
}

.p3{
    width: 400px;
    line-height: 50%;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>对齐</title>
    <link href="style.css" type="text/css" rel="stylesheet">
</head>
<body>
    <p class="p1">This is my web page
        This is my web page
        This is my web page
        This is my web page
        This is my web page
        This is my web page
    </p>

    <p class="p2">This is my web page
        This is my web page
        This is my web page
        This is my web page
        This is my web page
        This is my web page
    </p>

    <p class="p3">This is my web page
        This is my web page
        This is my web page
        This is my web page
        This is my web page
        This is my web page
    </p>
</body>
</html>

max-height 设置元素最大高度

max-width 设置元素最大宽度

.p1{
    line-height: normal;
    max-width: 250px;
}

min-width 设置元素最小宽度

min-height 设置元素最小高度

width 设置元素宽度

二、分类操作

clear 设置一个元素的侧面是否允许其他的浮动元素

cursor 规定当指向某元素之上时显示的指针类型

p{
    cursor: auto;
}

p{
    cursor: alias;
}

p{
    cursor: cell;
}

display 设置是否及何时显示元素

li{
    display: inline;
}
<ul>
    <li>Hello</li>
    <li>Hello</li>
    <li>Hello</li>
    <li>Hello</li>
</ul>

float 定义元素在哪个方向浮动

position 把元素放置到一个静态的、相对的、绝对的、固定的位置

visibility 设置元素是否可见或不可见

li{
    display: inline;
    visibility: hidden;
}

li{
    display: inline;
    visibility: visible;
}

以上是“Css如何实现分类”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注亿速云行业资讯频道！

Css如何实现分类

相关阅读