web前端（文本样式、元素显示模式、边框、轮廓线、定位）

还有醒着的咩

于 2023-07-25 16:55:40 发布

阅读量306

点赞数

分类专栏： web前端文章标签：前端 html html5 css chrome css3

本文链接：https://blog.csdn.net/m0_74355247/article/details/131920406

版权

web前端专栏收录该内容

15 篇文章 0 订阅

订阅专栏

字体样式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        p{
            /* font-size：字体大小、字号（默认为16px） */
            font-size: 20px;

            /* font-family：字体 */
            font-family: "微软雅黑";

            /* font-weight：字体粗细（默认为normal、400） */
            font-weight: bold;

            /* font-style：字体样式 */
            font-style: normal;
            
            /* 顺序为：style、weight、size、family */
            font: italic 700 20px 宋体;/* 不推荐 */

            /* css的层叠性，属性名相同是，后面的样式会覆盖前面的样式。 */
        }
    </style>
</head>
<body>
    <p>我是一段文字，你有本事打我呀！</p>
</body>
</html>

文本样式

文本缩进

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* body{
            text-indent: 20px;
        } */

        p{
            font-size: 40px;
            /* text-indent: 32px; */
            text-indent: 2em;/* em--两字符宽度 */
        }
    </style>
</head>
<body>
    <p>
        琪亚娜，当你醒来你会发现一切都变了世界已经不再美好，那
        些平凡的日常也都一去不回。
    </p>
    <p> 
        但是不要放弃琪亚娜,抬起头继续前进吧，去把这个不完美的故
        事变成你所期望的样子这便是最后一课了。活下去，琪亚娜真......
        再喝一杯啊。
    </p>
</body>
</html>

文本对齐方式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .box1{
            /* text-align：对齐方式（居中的不是元素，而是内容） */
            text-align: center;
        }

        .box2{
            width: 300px;
            height: 400px;
            background-color: aquamarine;
            text-align: center;
        }
    </style>
</head>
<body>
    <div class="box1">我是一个小盒子</div>
    <div class="box2">
        <img src="../day1/map.jpg" alt="" width="200px">
        <p>我是文字</p>
    </div>
</body>
</html>

文本修饰

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        a{
            /* text-decoration：清除a链接默认样式 */
            /* text-decoration: none; */
            /* text-decoration: line-through; */
            /* text-decoration: underline; */
            text-decoration: overline;
        }
    </style>
</head>
<body>
    <a href="#">去百度</a>
</body>
</html>

文本大小写转换

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* 转大写 */
        ul li:nth-child(1){
            text-transform: uppercase;
        }
        
        /* 转小写 */
        ul li:nth-child(2){
            text-transform: lowercase;
        }
    </style>
</head>
<body>
    <ul>
        <li>abc我是1li</li>
        <li>ABC我是2LI</li>
        <li>abc我是3li</li>
        <li>abc我是4li</li>
    </ul>
</body>
</html>

文本溢出

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
            width: 300px;
            gap: 500px;
            background-color: aqua;
            overflow: auto;/* 纵向滚动条 */
            
            /* overflow: hidden;隐藏溢出部分 */
            /* overflow: scroll;横向滚动条 */

            /* white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis; */
        }
    </style>
</head>
<body>
    <div>Lorem ipsum dolor sit amet consectetur adipisicing elit. Natus illum odio animi est neque necessitatibus nulla odit quaerat debitis hic. A fugiat natus quos! Architecto rerum rem eum reiciendis repellat?
    Maiores cumque blanditiis atque mollitia laudantium quam, explicabo qui sit ad cum quis ex fuga minus eaque nostrum autem facere fugit dignissimos ipsa quae perferendis ducimus a voluptas! Suscipit, nesciunt!
    Architecto error similique mollitia repudiandae id velit consectetur dolore praesentium odit ipsa minima natus deleniti temporibus aliquid incidunt officiis quis cum sapiente laboriosam porro ad deserunt, et qui accusamus. Reprehenderit!
    Officiis animi labore deleniti! Rerum mollitia amet, quae tempore corrupti placeat nesciunt voluptatibus saepe labore quibusdam dolorum necessitatibus. Libero assumenda placeat voluptatum doloremque quis numquam quaerat esse error facilis totam.
    Tenetur facere, impedit distinctio aliquam vel, sit commodi odit sint veritatis ipsa earum facilis eveniet esse beatae adipisci iusto minus recusandae amet ut quis tempora ea libero. Eligendi, eum laboriosam.
    Explicabo dignissimos doloremque facere perspiciatis inventore libero eveniet laudantium commodi aspernatur blanditiis quam accusantium iusto delectus, nobis non quo vero officiis mollitia neque! Animi blanditiis et consequuntur? Architecto, accusamus dolore.
    Fugit neque eum facilis inventore nisi praesentium vero quidem, sequi delectus voluptates. Nesciunt et non voluptates delectus quae voluptate ut velit deleniti eius explicabo eum veniam, fugiat, quidem quasi animi!
    Earum, animi? Reprehenderit necessitatibus sint tempore, est reiciendis voluptates, eos praesentium voluptas omnis recusandae velit nemo eum saepe sunt labore placeat libero dolores suscipit exercitationem quos commodi facilis sequi! Corporis.
    Veritatis possimus esse eaque deleniti laboriosam vero, officia nostrum! Hic fugit nostrum veritatis culpa doloribus laboriosam, quidem earum. Non libero distinctio eum cum officiis inventore accusamus quae neque repudiandae voluptatem?
    Illo provident, assumenda quae deleniti rerum eligendi tempora doloremque unde pariatur, quod veritatis dolorem quas sint nihil officiis magnam minus laboriosam esse accusamus. Atque beatae, laudantium facere asperiores ipsum ratione?</div>
</body>
</html>

背景设置

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            /* width: 3000px; */
            height: 3000px;
            /* background-color: pink;
            background-image: url(./背景.jpg);
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-position: right bottom; */

            background: pink url(./背景.jpg) no-repeat right bottom;
            /* background-size: ; */
        }
    </style>
</head>
<body>
    
</body>
</html>

元素显示模式转换

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        span {
            /* 将行内元素转化为行内块元素 */
            display: inline-block;
            width: 100px;
            height: 50px;
            background-color: pink;
        }

        div {
            display: inline-block;
        }
    </style>
</head>

<body>
    <span>小盒子</span>
    <span>小盒子</span>
    <span>小盒子</span>


    <div>我是一段文字</div>

</body>

</html>

轮廓线

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        input{
            /* 取消轮廓线 */
            outline-style: none;
            /* outline: none; */
            
            /* 点状轮廓线
            outline-style: dotted; */
            /* 双轮廓线
            outline-style: double; */

            /* 颜色 */
            outline-color: aqua;
            
            /* 宽度 */
            outline-width: thick;
            outline-width: 50px;
        }
    </style>
</head>
<body>
    <input type="text" name="usename">
</body>
</html>

边框

边框属性设置

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
            width: 300px;
            height: 300px;
            background-color: aqua;
            
            border: 1px solid red;
            /* 宽度 */
            border-width: 3px;
            border-bottom-width: 50px;
            border-top-width: 40px;
            
            border-color: blueviolet;
            
            border-style: solid;
            
            /* 边框弧度 */
            border-radius: 50%;
            border-top-left-radius: 50%;
            border-bottom-right-radius: 50%;
        }
    </style>
</head>
<body>
    <div></div>
</body>
</html>

合并相邻边框

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* 合并边框 */
        table {
            border-collapse: collapse;
        }

        td {
            width: 40px;
            height: 30px;
            border: 3px solid black;
        }
    </style>
</head>

<body>


    <table cellspacing="0">
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>

        </tr>
    </table>
</body>

</html>

定位

绝对定位

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .grandfather {
            position: relative;
            width: 1200px;
            height: 1200px;
            background-color: aquamarine;
        }
        
        .father{
            /* 相对定位 */
            position: relative;
            width: 800px;
            height: 800px;
            background-color: aqua;
            margin: 100px;
        }

        .son{
            width: 200px;
            height: 200px;
            font-size: 40px;
        }

        .son1{
            /* 绝对定位会放弃原来的位置（子绝父相--逐级查找父级元素是否有相对定位，如果有，以父亲为定位参考，如果没有，继续向上查找） */
            /* 绝对定位 */
            position: absolute;
            top: 50px;
            left: 90px;
            bottom: 40px;
            background-color: blue;
            /* z-index：显示的优先级 */
            z-index: 2;
        }

        .son2{
            position: absolute;
            bottom: 50px;
            background-color: yellow;
        }
    </style>
</head>
<body>
    <div class="father">
        <div class="son1">1</div>
        <div class="son2">2</div>
    </div>
</body>
</html>

固定定位

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body {
            height: 3000px;
            background-color: pink;
        }

        .box1 {
            /* 固定定位  相对于可视窗口进行定位   放弃原来位置 */
            position: fixed;
            top: 100px;
            width: 100px;
            height: 100px;
            background-color: aqua;
        }

        .box2 {
            width: 100px;
            height: 100px;
            background-color: rgb(227, 19, 206);
        }
    </style>
</head>

<body>
    <div class="box1">
        nihao
    </div>
    <div class="box2"></div>
</body>

</html>

粘性定位

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        p {
            position: sticky;
            top: 20px;
            background-color: pink;
        }
    </style>
</head>

<body>

    m dolores voluptatibus tempore explicabo. Iste deleniti animi eius exercitationem
    quidem.
    Dignissimos saepe recusandae sed, officiis similique repellat sapiente quos cupiditate repellendus deleniti. Odio
    possimus tenetur dolorum voluptatum fugit architecto. Accusantium minima ullam dolor eum numquam voluptates quas,
    consequatur nemo quibusdam.
    Explicabo a, cumque maiores iusto vero error perferendis quasi suscipit consequuntur. Cumque obcaecati sunt minus
    explicabo ab. Fugiat, quis fuga animi laudantium deserunt ipsum ex dolorem, cumque in porro sequi?
    Ex qui quasi veniam ea pariatur! Deserunt, mollitia voluptatum obcaecati vitae illo iusto voluptatibus doloremque
    perspiciatis. Quaerat odio error voluptatum expedita esse, accusamus tenetur consequuntur necessitatibus nihil
    ducimus, hic doloribus!
    Molestiae autem consequuntur dignissimos reprehenderit illum nam ratione? Quae ex officia molestias quaerat cum ad
    eos nam autem reprehenderit. Praesentium suscipit laborum aut dignissimos aperiam laboriosam officiis perferendis,
    numquam tempore corrupti recusandae modi dolorum tempora fuga quam, maiores
    architecto quae delectus cum! Ipsa laboriosam rem ut molestias quia quisquam nesciunt corporis provident asperiores
    voluptas?
    Pariatur excepturi cumque ratione iure dignissimos voluptatibus, debitis, est aliquid, quia quis sit optio.
    Perspiciatis, voluptatem. Obcaecati inventore culpa officia, eveniet odit voluptates, rem expedita saepe dicta,
    neque sit laudantium.
    Labore iste id, soluta maiores in nulla quidem deleniti? Rem odio obcaecati quis iste, delectus quam illo,
    laboriosam doloribus architecto natus blanditiis, consequatur assumenda temporibus. Aliquam voluptate eius quam
    animi.
    Sit, quis hic! Et explicabo dolore aperiam, vitae inventore, facere nulla ut a totam, illo expedita excepturi qui
    laudantium cumque labore cupiditate ex iste. Nam modi blanditiis dolorum accusantium debitis.
    Beatae aliquam perspiciatis velit sed veritatis necessitatibus vel debitis eligendi sint reprehenderit temporibus
    accusamus similique quaerat, a ratione cupiditate labore atque nulla tenetur. Consequuntur officiis perferendis,
    odit reprehenderit ratione praesentium.
    Labore ad temporibus impedit sunt autem quos accusantium repellendus magnam fugiat minus dolor laborum unde
    accusamus saepe doloribus facere voluptate mollitia, consectetur est cupiditate deserunt dolorem repudiandae
    excepturi! Eius, saepe.
    Ut id atque quaerat saepe harum vero molestiae, aut ipsum possimus maxime eum adipisci incidunt nobis earum
    perferendis laboriosam accusamus dolorum cumque ea totam. Dolorem quod architecto modi placeat consequatur?
    Incidunt reiciendis autem vel iste quaerat laboriosam maxime suscipit dolorum optio deleniti. Inventore cum vitae
    iusto quam sapiente molestias numquam sunt nulla aut fugit, explicabo porro libero eum. Dolore, pariatur!
    Vel natus, expedita aspernatur veritatis dignissimos molestiae tempora aperiam impedit maxime. Molestiae vitae
    minima labore a ipsam, facere distinctio voluptate, laudantium tempore id est quis sapiente aperiam expedita ea
    corporis!
    Sequi aut dolorem in. Id similique voluptate asperiores totam et eius accusamus provident necessitatibus
    praesentium, repellendus explicabo eveniet mollitia voluptatibus minima. Dolore alias quisquam rerum ratione quasi
    incidunt obcaecati ut.
    Amet, incidunt ipsa cupiditate quod quaerat impedit, nisi repellendus ex ad voluptate blanditiis libero iusto nulla
    consequuntur itaque nihil. Dolores ex nobis fugiat iste. Debitis vel natus pariatur explicabo totam!
    Architecto sunt minima fuga dicta et odit pariatur laboriosam recusandae in nostrum amet placeat atque aspernatur
    quo ut enim hic aut quasi provident, exercitationem voluptatum. Necessitatibus, labore! Voluptas, deleniti labore?
    Necessitatibus dolorum nisi ullam animi mollitia tempora voluptatem vel itaque numquam nam? Labore omnis
    voluptatibus, expedita in nostrum totam dolore! Perferendis iusto exercitationem veritatis ipsa nisi. Ea accusantium
    tempore reprehenderit?
    Labore laborum saepe veritatis a enim sunt quam deleniti ab temporibus quae iure ipsam cupiditate odit nulla
    eligendi dolorem obcaecati neque repudiandae alias explicabo, animi, amet vel officiis eaque? Quae?
    Perspiciatis dolorum provident, ex cumque vel aliquid temporibus error mollitia reiciendis accusamus aperiam, in
    quibusdam quidem nam amet laborum unde natus eius atque. Est sit atque modi, iure expedita aliquid!
    Provident architecto nulla ea accusantium modi itaque voluptatem, quasi ex et dignissimos dicta voluptatum commodi
    aperiam corporis minus distinctio iusto optio animi, accusamus exercitationem odit perferendis minima rerum sunt!
    Maiores!
    Numquam veniam explicabo neque exercitationem! Maxime, quo harum, earum ipsa consequuntur perferendis aliquid nisi
    maiores tempore accusantium omnis architecto? Dolorem consequatur delectus fugiat voluptatem nesciunt quasi impedit
    animi tenetur at.
    Assumenda porro beatae qui impedit esse dolores asperiores doloribus tempore ut sequi. Ipsum repudiandae at dicta,
    libero dolores labore illo deleniti in quos vero totam exercitationem cum omnis atque officiis!
    Magni cum deserunt quo dignissimos est reiciendis quos. Omnis error, cum voluptates quos aliquam repellendus
    molestiae est illum quisquam aspernatur officiis exercitationem atque porro, facilis dolorem totam debitis velit
    quia?
    Maiores perspiciatis, exercitationem saepe blanditiis, aliquid vero fuga dicta reiciendis possimus, nam commodi
    veritatis cupiditate accusamus aut incidunt tenetur soluta. Minus, eos quasi. Quidem earum sapiente saepe, doloribus
    possimus laboriosam?
    Ex debitis quae ut explicabo placeat odio ad cupiditate, laboriosam facilis doloribus deleniti rem dolorum ullam
    fuga mollitia sequi eius illum magni! Dolorem nisi nesciunt, tenetur vel soluta aliquam maiores?
    Laudantium, voluptates maxime odio et illo dolore eveniet quae laborum quibusdam nemo amet molestias eligendi eius
    possimus odit maiores doloremque quisquam? Optio fugiat, fuga architecto deserunt beatae laboriosam ea adipisci?
    Sit atque minus excepturi aliquam blanditiis similique ipsam, beatae necessitatibus molestias nam corrupti eius
    soluta, magni ratione in maiores iste laboriosam. Voluptatibus aspernatur aliquam quam eligendi eius molestiae sint
    est!
    Laudantium distinctio, quo dignissimos ipsam ullam molestias voluptas temporibus explicabo rem quos ea odio veniam
    cumque accusantium dolorem harum, illum minus ex numquam voluptatem similique! Dicta ullam in quod expedita.
    Dolores doloremque necessitatibus recusandae hic dolore. Architecto alias cumque, iusto consectetur fugiat obcaecati
    tenetur amet a esse quod ratione repudiandae culpa voluptates autem! Aspernatur minus impedit a voluptate iste
    accusamus.
    <p>Error deleniti obcaecati blanditiis totam nam, facere similique nemo illo, voluptatem voluptates assumenda
        voluptate. Laboriosam similique quas itaque at mollitia. Accusantium inventore, et in unde quia dolore! Tenetur,
        esse tempora!</p>
    Soluta non quas dicta possimus dolores distinctio consequuntur fugit rerum id corporis voluptas repudiandae, nihil
    praesentium nisi voluptatibus perferendis sequi reprehenderit quo reiciendis, dolor, iure expedita. Ullam
    consectetur corporis exercitationem.
    repellendus suscipit molestiae accusamus magni in quae optio minus,
    aut doloribus temporibus assumenda sint quaerat blanditiis exercitationem numquam cumque eveniet pariatur iste
    voluptatum. Expedita.
    Neque ipsum aspernatur laborum. Ducimus quisquam exercitationem fuga sunt recusandae! Sit ullam, dolores inventore
    ex mollitia fuga beatae nihil incidunt vero aut doloremque odit quibusdam vel animi expedita, error harum.
    Asperiores ad ullam similique numquam quisquam. Quam repellendus quia sint quas ullam incidunt earum accusamus
    consectetur quasi voluptatibus. In delectus sint libero nulla impedit possimus, aperiam autem error porro numquam.
    Quasi architecto consectetur veniam voluptate neque quis odit consequatur provident. Quod repudiandae expedita esse
    cumque obcaecati repellendus laudantium totam, reprehenderit quis ex. Tempore unde, accusamus quos nesciunt
    quibusdam facilis veritatis.
    Totam, quae autem cupiditate, officia dolorem hic impedit enim expedita blanditiis et, voluptates tempore ipsum
    quaerat tempora dolore unde nemo. Aperiam cupiditate a cumque, quod ducimus earum modi vel reprehenderit!
    Quisquam explicabo dolore enim atque magni, illo eveniet corporis illum, dolores maiores, incidunt vero vel. Hic
    velit, dolorum quo possimus, unde recusandae excepturi molestias quod placeat soluta sapiente dolore est.
    Optio in modi tenetur quisquam enim veniam illum quae nesciunt alias nostrum voluptas veritatis tempore, perferendis
    a dolor, vero quos eaque. Fuga in unde minima, blanditiis dolor rem repellendus quis!
    Nihil, ullam porro veniam cumque est magnam provident voluptas. Consequuntur fugiat in illo excepturi a aspernatur
    facilis numquam praesentium ut incidunt autem optio, recusandae possimus sequi expedita, ipsum, temporibus
    blanditiis.
    Laboriosam ipsum optio nulla repellat earum consequuntur itaque assumenda provident odio blanditiis vero excepturi
    rerum sed, quod cumque porro, ratione culpa voluptate doloremque, recusandae ipsa accusantium vel minima. Quisquam,
    autem.
    Dolores nemo sapiente temporibus aperiam mollitia a voluptas aspernatur? Consectetur porro explicabo, neque culpa
    aperiam ea, rem consequatur voluptas autem quod soluta aliquid necessitatibus, sed excepturi ratione magni omnis
    reiciendis.
    Ipsum modi dolor atque enim error, eligendi vitae eius quis? Eius repellendus doloribus hic pariatur impedit in amet
    ipsam fugit corrupti beatae incidunt suscipit consectetur similique veritatis necessitatibus, consequatur delectus.
    Cumque tempore iure similique soluta. Nostrum quae quidem perferendis vel sit, distinctio sed sint nemo blanditiis
    voluptatibus iusto saepe quisquam, obcaecati consectetur debitis maiores praesentium fuga eligendi expedita magni
    odio.
    Sed iste magni voluptatem hic blanditiis placeat cum id quasi sunt veniam commodi doloremque totam tempore
    voluptatum facere officia aspernatur, ad praesentium, vitae mollitia quod repudiandae voluptate ex esse. Rerum.
    Porro neque, ipsam animi autem illo officiis deserunt fugiat quaerat obcaecati voluptas maxime aut doloremque.
    Perspiciatis aperiam ut temporibus perferendis, praesentium sed provident nesciunt aspernatur itaque fugit,
    distinctio laboriosam at.
    Aliquid numquam nesciunt perspiciatis quis autem qui ullam dignissimos temporibus hic, quia ipsa esse, laborum,
    dolorem sed molestias voluptatum laboriosam iure minima cum fugit. Architecto voluptatum voluptatem nemo modi
    placeat.
    Asperiores consectetur soluta dolor hic laborum velit commodi temporibus veritatis, fugiat ullam esse facilis fugit
    fuga ut? Nesciunt modi doloremque, magni mollitia voluptatem quidem pariatur ipsam repellendus amet illo delectus.
    Debitis ad fugiat labore iusto vero porro sit laborum, qui blanditiis neque sint voluptas iure in veniam eum
    asperiores aspernatur ipsam enim laudantium? Blanditiis nobis sapiente earum, magni debitis quae!
    Nihil, ducimus necessitatibus? Pariatur vitae consequatur dolores dolore ullam enim animi inventore quibusdam
    asperiores ipsa in voluptate quae hic vel quidem distinctio aut nostrum magnam, excepturi aliquam a maxime saepe.
    Ea voluptas vel dicta minus doloremque sit aperiam delectus. Voluptates hic provident debitis eum tenetur unde nulla
    ullam ex? Id ratione iure modi incidunt porro quam dignissimos unde distinctio hic.
    Consequatur nam ullam commodi voluptatibus laborum, sunt quos ex alias necessitatibus deleniti! Corporis, delectus
    sequi voluptatem eveniet iure aut, voluptatibus ex sit nihil qui consequuntur, porro odio illo officia at?
    Ipsum reprehenderit voluptates cumque debitis sint amet consequatur suscipit delectus recusandae harum fugiat
    temporibus quod, dolorem veritatis architecto ratione, minima animi perspiciatis ipsa expedita soluta! Ad
    consectetur culpa dolorem nulla.
    Itaque nulla vitae voluptate, perferendis, quibusdam vero veniam porro excepturi pariatur debitis soluta in
    voluptatum commodi deleniti quasi quis. Rerum dolorem reiciendis ab soluta perspiciatis quas rem, veniam incidunt
    vel?
    Minima repudiandae repellat, non repellendus aperiam illo. Placeat labore, expedita laborum cumque similique aliquid
    optio, maiores nemo recusandae enim, eaque id iure voluptates. Nihil ex atque fugit eius ipsam quis!
    Nobis aut, non quidem, accusamus pariatur obcaecati fuga architecto voluptate laborum amet recusandae ex ipsa quod
    illum, sequi ad optio. Eligendi hic officia porro quaerat ipsam possimus quod error mollitia?
    Repudiandae perferendis quidem a numquam non minus magni est error optio tempore atque, corporis obcaecati soluta
    molestias temporibus eaque expedita, quia voluptate possimus rerum totam facere reprehenderit natus. Cupiditate,
    reprehenderit?
    Tempora praesentium alias minus est architecto, ab eum, harum repellendus consequuntur eos veritatis veniam,
    reprehenderit qui culpa voluptatibus facilis! Ipsa nulla repudiandae voluptates maxime saepe blanditiis expedita
    nemo facilis quam?
    Beatae animi fuga velit aspernatur architecto explicabo! Iusto totam dolorem quos labore asperiores alias enim! Sint
    impedit earum debitis commodi error, quisquam labore maiores vel nostrum vero dolore, aut modi.
    Nihil, quibusdam assumenda veritatis consequatur fugiat ut perspiciatis illum. Reiciendis, impedit cumque. Sunt
    laudantium esse odit deserunt maiores in quis, iure vitae exercitationem laborum corrupti sapiente possimus
    adipisci. Placeat, ipsa?
    Iusto odio inventore illum libero, quae aspernatur facilis nihil neque asperiores sit modi alias maiores unde,
    pariatur, sunt corrupti perferendis voluptatem nostrum quam. Voluptatem perferendis sunt vero? Dolorem,
    voluptatibus! Facilis?
    Nemo amet eveniet reiciendis, animi facere adipisci molestias id! Nobis, enim. Laborum rem minus nesciunt, nobis
    perferendis mollitia, id aspernatur iste iusto quaerat quis maiores, molestias beatae praesentium laboriosam
    excepturi.
    Quos, doloremque! Tempore doloribus quo perspiciatis, quos cumque at, suscipit reprehenderit delectus, accusantium
    quis saepe vel totam nam impedit illum consequuntur commodi amet dolorem. Hic omnis inventore quis alias iste?
    Eligendi rem, tempore sed corrupti ipsum praesentium. Nostrum nulla soluta atque in, illum obcaecati perferendis
    asperiores id voluptatem facere odit rem, expedita, veniam quisquam aspernatur mollitia fuga? Nemo, accusamus
    dignissimos.
    Deserunt cum dolorum alias nesciunt aliquid dignissimos esse dolorem quidem hic aperiam! Voluptatum quos rerum
    nostrum tempore placeat accusamus, ex ipsum earum quaerat, sint eius dicta delectus voluptatibus quae. Dolorem.
    Totam ut iste quas odit voluptate eos nostrum minima, vitae labore quasi voluptatum inventore quae corrupti
    asperiores ab aut veritatis numquam error. Officiis, exercitationem repellat. Molestias sint suscipit voluptatum
    aspernatur?
    Vel dolore maiores sapiente impedit minus eaque assumenda totam unde quasi? Assumenda corporis obcaecati inventore
    suscipit, magni harum. Voluptatum expedita quaerat laboriosam recusandae velit? Sapiente expedita optio totam non
    veniam?
    Dolore, aliquam! Maxime praesentium totam cupiditate quod, repudiandae voluptas, quisquam eaque fugit quo dolore
    voluptatem eveniet consequatur amet repellat exercitationem soluta repellendus sequi aliquid nostrum alias laborum
    fugiat at! Veritatis.
    Voluptates, assumenda. Corporis necessitatibus dolorum cupiditate, quo fugiat, et soluta aliquid porro repellat
    optio quisquam non autem temporibus! Earum rem accusantium, saepe omnis laboriosam facilis dolorum itaque fugiat
    voluptatum maxime!
    Culpa vero repellendus ducimus nisi nesciunt praesentium accusamus nostrum voluptate, tenetur sequi? Quam sapiente,
    quaerat odio inventore maiores itaque ex pariatur maxime aut autem rerum laudantium! Sed quas nihil pariatur!
    Provident ipsum a ratione possimus nulla, cupiditate, dolorem vero autem suscipit quaerat aliquid! Ipsum, harum
    tenetur, doloribus expedita delectus ullam blanditiis repellat, quis nisi vitae temporibus nobis molestiae autem
    perspiciatis!
    Necessitatibus recusandae suscipit repellendus aliquam praesentium placeat eveniet aut consequatur sequi totam dolor
    cum officiis, harum corrupti fuga doloribus eius vero quidem dolores culpa porro iure deserunt quo ratione!
    Quisquam.
    Sit at, cumque possimus ipsa voluptatibus harum recusandae ex, quos sequi nostrum autem hic. Inventore commodi
    veritatis sapiente eum atque id minima et modi aspernatur quibusdam iusto, ipsam laborum debitis.
    Obcaecati, harum. Totam, distinctio reprehenderit praesentium deleniti suscipit nisi omnis, et magni perspiciatis,
    inventore quae consectetur quos numquam illum nam iure amet delectus officiis cumque veritatis impedit libero sit
    exercitationem.
</html>