B站pink老师CSS学习(二)

文章目录

一、emmet语法

1.快速生成HTML结构语法

二、复合选择器

1.什么是复合选择器

2.后代选择器

3.子选择器

4.并集选择器

5.伪类选择器

6.链接伪类选择器

javascript 复制代码
    <style>
        /* 1.未访问的链接 a:link  把没有点击过的(访问过的)链接选出来 */
        a:link {
            color: #333;
            text-decoration: none;
        }
 
        /*2. a:visited 选择点击过的(访问过的)链接 */
        a:visited {
            color: orange;
        }
 
        /*3. a:hover 选择鼠标经过的那个链接 */
        a:hover {
            color: skyblue;
        }
 
        /* 4. a:active 选择的是我们鼠标正在按下还没有弹起鼠标的那个链接 */
        a:active {
            color: green;
        }
    </style>
</head>
 
<body>
    <a href="#">小猪佩奇</a>
    <a href="http://www.xxxxxxxx.com">未知的网站</a>
</body>

7:focus伪类选择器

8.总结

三、元素的显示模式

1.什么是元素显示模式

2.块元素

3.行内元素

4.行内块元素

5.总结

6.元素显示模式转换

  • 截图小工具 snipaste

7.单行文字垂直居中

三、CSS的背景

1.背景颜色

2.背景图片

3.背景平铺

4.背景图片位置


5.背景图像固定

6.背景复合写法

7.背景色半透明

8.总结

四、CSS三大特性

1.层叠性

2.继承性

  • 行高的继承

3.优先级


注意点

4.权重的叠加

相关推荐
世伟爱吗喽1 小时前
NUXT3学习日记四(路由中间件、导航守卫)
学习
qq_364371721 小时前
Vue 内置组件 keep-alive 中 LRU 缓存淘汰策略和实现
前端·vue.js·缓存
y先森2 小时前
CSS3中的弹性布局之侧轴的对齐方式
前端·css·css3
飞凌嵌入式2 小时前
飞凌嵌入式旗下教育品牌ElfBoard与西安科技大学共建「科教融合基地」
嵌入式硬件·学习·嵌入式·飞凌嵌入式
y先森7 小时前
CSS3中的伸缩盒模型(弹性盒子、弹性布局)之伸缩容器、伸缩项目、主轴方向、主轴换行方式、复合属性flex-flow
前端·css·css3
前端Hardy7 小时前
纯HTML&CSS实现3D旋转地球
前端·javascript·css·3d·html
susu10830189117 小时前
vue3中父div设置display flex,2个子div重叠
前端·javascript·vue.js
Red Red7 小时前
网安基础知识|IDS入侵检测系统|IPS入侵防御系统|堡垒机|VPN|EDR|CC防御|云安全-VDC/VPC|安全服务
网络·笔记·学习·安全·web安全
IT女孩儿8 小时前
CSS查缺补漏(补充上一条)
前端·css
吃杠碰小鸡9 小时前
commitlint校验git提交信息
前端