Grid 网格布局
摘要：<template> <div> <!-- <div class="container"> <div class="item item1" style="grid-area: 2/2/3/4;">1</div> <div class="item item2">2</div> <div class="
阅读全文
posted @ 2023-11-04 15:03
随笔分类 - css
css三列布局(两边固定中间自适应)
摘要：1.flex布局 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #box { width: 100%; height: 100px; display: flex
阅读全文
posted @ 2021-03-29 11:42
css垂直水平居中
摘要：1.利用弹性布局 display: flex; align-items: center; justify-content: center; 2.绝对定位(知道宽高) position: absolute; top: 50%; left: 50%; height: 400px; width: 400p
阅读全文
posted @ 2021-03-29 10:34
:last-child 和 :last-of-type
摘要：作为CSS常用伪类选择器，:last-child经常会被用到; 但有时遇到极端情况，它会意外失效，让人摸不着头脑，例子如下：html: <div class="card"> <p>1</p> <p>2</p> <p>3</p> <p>4</p> <p>5</p> <p>6</p> <p>7</p>
阅读全文
posted @ 2021-03-26 09:50
