样式补充

最新推荐文章于 2023-03-13 14:58:05 发布

空杯lk

最新推荐文章于 2023-03-13 14:58:05 发布

阅读量92

点赞数

分类专栏： html-css

本文链接：https://blog.csdn.net/xiaoka2/article/details/105599635

版权

html-css 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

样式补充

display:list-item

设置为该属性值的盒子，本质上仍然是一个块盒，但同时该盒子会附带另一个盒子

元素本身生成的盒子叫做主盒子，附带的盒子称为次盒子，次盒子和主盒子水平排列

涉及的css：

list-style-type

设置次盒子中内容的类型

list-style-position

设置次盒子相对于主盒子的位置

速写属性list-style

清空次盒子

list-style:none

图片失效时的宽高问题

如果img元素的图片链接无效，img元素的特性和普通行盒一样，无法设置宽高

 <style>
        img{
            width: 200px;
            height: 200px;
            border: 2px solid;
            display: inline-block;
        }
    </style>
<body>
    <img src="" alt="失效的图片">
</body>

行盒中包含行块盒或可替换元素

行盒的高度与它内部的行块盒或可替换元素的高度无关

text-align:justify

text-align:

left: 左对齐
right：右对齐
center：居中
justify：除最后一行外，分散对齐

制作一个三角形

<style>
        div{
            width: 0;
            height: 0;
            border: 10px solid transparent;
            border-left-color: red;
        }
    </style>