我的账户
猩码学苑

专注C++开发菁英教育

亲爱的游客,欢迎!

已有账号,请

如尚未注册?

李虎跃-2022-11-25

[复制链接]
李维尼 发表于 2023-1-5 23:33:06 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
今日学习内容:
rem布局
        Rem单位
                rem(root em)是一个相对单位,类似于em,但是em是相对于父元素的font-size字体大小来说的,rem是相对于html元素的字体大小来说的。
                rem的优势:父元素的文字大小可以会有很多数值,基本不能保持统一,但是整个页面只有一个html元素,所以就可以很好的来控制整个页面的元素大小
        媒体查询
                媒体查询是CSS3新增的语法
                        使用 @media 查询,可以针对不同的媒体类型定义不同的样式
                        当我们重置浏览器大小的过程中,页面会根据浏览器的宽度和高度重新去渲染页面
                        @media 可以针对不同的屏幕尺寸来设置不同的样式
                媒体查询的语法规范
                        用@media 开头
                        mediatype  媒体类型
                                all  用于所有的设备
                                print 用于打印机和打印预览
                              
screen  用于电脑屏幕、平板电脑、智能手机等等设备
                关键 and/not/only
                        and 可以将多个媒体特性连接到一起,相当于“且”的意思
                        not 排除某个媒体类型,相当于“非”的意思,可以省略
                        only 指定某个特定的媒体类型,可以省略
                media feature 媒体特性必须放在小括号里面
                        width  定义输出设备中页面可见区域的宽度
                        min-width  定义输出设备中页面最小的可见区域宽度
                        max-width  定义输出设备中页面最大的可见区域宽度
                复合写法
                         @media mediatype and|not|only (media feature) { CSS-code; }
        LESS基础
                维护CSS的一些弊端
                        css是一门非程序式的语言,没有变量、函数、作用等概念
                        css需要书写大量看似没有逻辑的代码,冗余程度是非常高的
                        不方便维护以及拓展,也不利于代码复用
                        CSS没有很好的计算能力
                        对于前端工程师来说,不太容易写出组织良好而且方便维护的css代码项目
                LESS介绍
                        Less(LeanerStyle Sheets)是一门CSS的扩展语言,也叫做CSS的预处理器。
                        作为CSS的扩展形势,它不仅没有减少CSS的功能,而且加入了一些程序式语言的特性
                        LESS可以让我们用更少的代码来做更多的事情。
                        常见的CSS的预处理器:Less、Sass、Stylus。
                        总结:Less是CSS的预处理语言,扩展CSS的程序特性
                LESS编译
                        我们使用easy less插件对less文件进行编译,编译完成后会自动生成一个css文件
                LESS嵌套
                        如果用到链接伪类,需要在伪类前加&符,否则链接伪类不起作用
                LESS运算
                        任何数字、颜色或者变量都可以参与运算,LESS为我们提供了加(+)减(-)乘(*)除(/)算术运算
                        注意点:
回复

使用道具 举报

关注0

粉丝0

帖子30

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

客服电话:18009298968

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

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

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