我的账户
猩码学苑

专注C++开发菁英教育

亲爱的游客,欢迎!

已有账号,请

如尚未注册?

CSS体系学习_陈佳乐_20230210

[复制链接]
StandBmCR学员认证 发表于 2023-2-10 23:47:09 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
学习内容 8:00-18:00
一.CSS的定位
1.定位的组成
在使用定位布局时,可能会出现盒子重叠的情况,此时可以使用z-index来控制盒子的前后顺序(z轴)
语法:
选择器 {z-index:1;}
数值可以是正整数、负整数或者0,默认值是auto,数值越大越靠上
如果属性值相同,则按照书写顺序,后来者居上
数字后面不可以加单位
只有定位的盒子才有z-index属性
2.定位的拓展
行内元素加了绝对定位或者固定定位,可以直接设置宽高
脱标的盒子不会触发外边距塌陷的问题

二.元素显示和隐藏
1.网站上的广告窗口,点击关闭了之后就看不到了,重新刷新页面可以显示,这就是元素的显示和隐藏
2.显示和隐藏的三种方式
display  显示隐藏
visibility 显示隐藏
overflow  溢出显示和隐藏

三.CSS的其他技巧
1.精灵图
精灵图的使用步骤
利用background 来插入背景图片
利用background-position属性来移动背景位置
一般情况下精灵提的都是负值(网页中x轴向右是正值,Y轴向下是正值,但精灵图都是向左和向上偏移的,所以都是负值)
2.鼠标样式
cursor: default;  默认鼠标样式(鼠标默认箭头)
cursor: pointer; 小手鼠标样式
cursor: text; 文本鼠标样式
cursor: move; 拖动鼠标样式
cursor: not-allowed; 禁止鼠标样式
3.输入框删除外框
outline: none;
4.文本域取消拖拽
5.行内元素的对齐方式
属性:vertical-align
属性值
top 顶线对齐
middle 中线对齐
bottom 底线对齐
baseline 基线对齐(默认值)
6.三角制作
先将盒子的宽高设置为0,然后边框设置为transparent,想用哪个三角,就将哪个边框设置颜色即可
7.CSS省略号的制作
8.字体图标的使用

21:00-23.30
1.复习白天学习内容
2.作业练习

二.遇到的问题
代码组合复杂

三.如何解决问题
多练习,编写

回复

使用道具 举报

关注0

粉丝0

帖子4

发布主题
大家都在学
课堂讨论
一周热帖排行最近7x24小时热帖
关注我们
专注C++菁英教育

客服电话:18009298968

客服时间:9:00-21:00

猩码学苑 - 专注C++开发菁英教育!( 陕ICP备2025058934号-1 )

版权所有 © 陕西菁英数字科技有限公司 2023-2026