CSS1.css选择某一个 (CSS :first-child 选择器,CSS选择器——伪类选择器)q:请将html模块中ul列表的第2个li标签和第4个li标签的背景颜色设置成”rgb(255, 0, 0)”。<html>
<head>
<meta charset=utf-8>
......
502
0
0
2023-04-09
「学习笔记」CSS基础CSS构造块「1. HTML的局限性」HTML满足不了设计者的需求，可以将网页结构与样式相分离，这样就可以在不更改网页结构的前提下，更换网站的样式。操作html属性不方便HTML里面添加样式带来的是无尽的臃肿和繁琐「2. CSS网页的美容师」让我们的网页更加丰富多彩，布局更加灵活自如。CSS最大的贡献：让HTML从样式中脱离，实现了HT
......
524
0
0
2023-04-06
CSS高级技巧CSS 属性书写顺序(重点):布局定位属性：display / position / float / clear / visibility / overflow自身属性：width / height / margin / padding / border / background文本属性：color / font / text-decorati
......
555
0
0
2023-04-06
0 前言#Flex布局是当下前端页面比较流行的布局之一，使垂直居中、水平居中变得尤为便捷。在日常开发中，经常可以用到，但是每次开发都要百度看一下它的一些属性细节，今天特地再进行一次系统的总结，这样以后自己就不用百度啦~~ 好的，下面开始~~~1 flex布局基本概念#我们要了解两个基本概念，分别为容器属性和项目属性。下面直接来看代码和图吧，用实战来举例子：
......
481
0
0
2023-03-18
回炉重造，css常规布局系统整理——实战开发后复盘小结#写在前面： 在了解css布局之前，我们先了解两个小概念，我认为这将对你有所帮助！ 块级元素：display:bloak；占据一行，下一个元素自动换行，如div等； 行内元素：display:inline；元素没有高宽，根据元素内的内容改变大小，如span、a标签等； 行内块：displa
......
362
0
0
2023-03-18
rem 适配布局rem 单位rem 是根 em(root em)的缩写，是相对于根元素(html 元素)的字体大小。rem 作用于非根元素字体大小时，相对于根元素字体大小；rem 作用于根元素字体大小时，相对于其初始字体的大小。比如，根元素（html）设置 font-size = 12px;非根元素设置 width: 2rem;则换成 px 表示就是 24p
......
572
0
0
2023-03-13
Flex 布局介绍Flex 是 Flexible Box 的缩写， 用来为盒状模型提供最大的灵活性，也被称为”伸缩布局”，”弹性布局”，”伸缩盒布局”，”弹性盒布局”。任何容器都可以指定为 Flex 布局（包括行内元素） 设为 Flex 布局后，子元素的 float、clear 和 vertical-align 属性将失效，Flex 布局可以实现垂直居中采用
......
518
0
0
2023-03-11
响应式布局原理使用媒体查询针对不同宽度的设备进行布局和样式的设置，从而适配不同设备。设备尺寸区间手机<768px平板[768px, 992px)桌面显示器[992px, 1200px)大桌面显示器(电脑)>=1200px响应式布局容器响应式布局需要一个父级作为布局容器，让子级元素实现变化效果原理：在不同屏幕下，通过媒体查询来改变布局容器的大小，再
......
550
0
0
2023-03-11
目录使用渐变实现网格利用渐变实现交叉虚线十字借助伪元素及 box-shadow 实现剩余符合最后最近，有网友问我，他们的一个作业，尽量使用少的标签去实现这样一个象棋布局：他用了 60 多个标签，而他的同学，只用了 6 个，问我有没有办法尽可能的做到利用更少的标签去完成这个布局效果。其实，对于一个页面的布局而言，标签越少不一定是好事，我们在考虑 DOM 的消耗
......
444
0
0
2023-02-28
我分别美化了几个不同版本的Next主题，这里把美化代码公布出来，第一种Next版本小于7.3可使用直接修改 \themes\next\source\css\_custom 将以下美化过程复制到custom.styl目录即可。// *****************************************************************
......
431
0
0
2023-02-12
CSS 层叠样式CSS引用:直接引用 直接在HTML标签的后面加上style类型声明即可,多个类型请用分号隔开.<body>
<p style="color: red"> hello lyshark </p>
<div style="color: yellow ; background: red"> h
......
390
0
0
2023-02-09
作为一个前端，我经常遇到list展示的需求。如果是设置一个list孩子节点的样式，我可能会这样写.list{
}
// 一般我list的child是div
.list > div {
}
但是遇到排名次的需求，前三名要用框框框柱,经常要写这样的代码 {new Array(6).fill(1).map((v, index) =
......
439
0
0
2023-01-26
1.自动换行p {
word-wrap:break-word;
word-break:normal;
}
2.强制不换行div{
white-space:nowrap;
}
3. 强制英文单词换行div{
word-break:break-all;
}
4.单行文本不换行多余文本显示省略号 行内元素最好转为inli
......
363
0
0
2023-01-24
哈喽，大家好，我是指北君。今天给大家介绍个好东西————TailwindCSS ！一. 引言css对于页面的美化作用不言而喻，但是在进行前端布局页面的时候，往往对页面样式的命名不胜其烦。很多的项目 ，都是对class语义化命名，简单的页面还可以接受，但是随着项目开发的深入，会出现很多类似的语义化场景，导致命名愈发困难。一边要小心不要命名重复，造成样式冲突，另
......
469
0
0
2023-01-24
CSS 滤镜属性允许我们使用css对元素后面的内容应用过滤效果，就和ps里面的功能一样(名字都是一样的！)快来看看吧！！！在日常开发中，偶尔会用到需要处理图片。如果让ui切不同颜色的图片，也会比较棘手，而且多张图片也会占用较多内存，提高http的请求，看一下css的滤镜可能会帮忙解决许多的问题哦！！！CSS 滤镜 : backdrop-filterbackd
......
554
0
0
2023-01-19