关注
分享
CSS学习中的一些小零碎。
帅帅邬同学
星辰和大海都需要门票，诗和远方的路费也都很贵，就好像我稍不努力连情怀都养不起！
展开
-
怎么看自己的CSS写得规范不规范？？？
CSS W3C 统一验证工具CssStats 是一个在线的 CSS 代码分析工具如果你想要更全面的，这个神奇，你值得拥有：W3C 统一验证工具????????????????????????????????因为它可以检测本地文件哦！！！...原创 2020-04-24 10:39:09 · 148 阅读 · 0 评论 -
CSS3中的文字阴影和凹凸文字！！！
文字阴影(CSS3)以后我们可以给我们的文字添加阴影效果了 Shadow 影子text-shadow:水平位置 垂直位置 模糊距离 阴影颜色;前两项是必须写的。 后两项可以选写。凹凸文字<head> <meta charset="utf-8"> <style> body { backgr...原创 2020-04-24 10:27:37 · 249 阅读 · 0 评论 -
CSS3中背景的高级用法！！！
背景半透明- 1.强烈推荐： background: rgba(r,g,b,alpha); r,g,b 是红绿蓝的颜色， alpha 是透明度的意思，取值范围是 0~1 之间。- 2.了解ie低版本浏览器 半透明filter:Alpha(opacity=50) ； // opacity值为0 到 100但是 此属性是盒子半透明，不是背景半透明哦，因为里面的内容也一起半透明了...原创 2020-04-24 09:56:14 · 406 阅读 · 0 评论 -
CSS中的优雅降级和渐进增强是什么呢？？？
优雅降级和渐进增强什么是渐进增强（progressive enhancement）、优雅降级（graceful degradation）呢？渐进增强 ( progressive enhancement )：针对低版本浏览器进行构建页面，保证最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。类似 爬山，由低出往高处爬 !!!优雅降级 ( gra...原创 2020-04-23 09:18:28 · 210 阅读 · 0 评论 -
Web前端工程师必须要知道的BFC(块级格式化上下文)！！！
BFC(块级格式化上下文)BFC(Block Formatting Context)直译为"块级格式化上下文"。元素的显示模式我们前面说过 元素的显示模式 display。分为 块级元素 行内元素 行内块元素 ，其实，它还有很多其他显示模式。那些元素会具有BFC的条件不是所有的元素模式都能产生BFC。w3c 规范：display 属性为 block, list-it...原创 2020-04-22 21:24:27 · 152 阅读 · 0 评论 -
不知道字体图标怎么用？？？这怎么能行，手把手教会你！！！
字体图标图片是有诸多优点的，但是缺点很明显，比如图片不但增加了总文件的大小，还增加了很多额外的"http请求"，这都会大大降低网页的性能的。更重要的是图片不能很好的进行“缩放”，因为图片放大和缩小会失真。 我们后面会学习移动端响应式，很多情况下希望我们的图标是可以缩放的。此时，一个非常重要的技术出现了，额不是出现了，是以前就有，是被重新"宠幸"啦。。 这就是字体图标（iconfont).字...原创 2020-04-22 20:38:43 · 449 阅读 · 1 评论 -
什么？？？CSS中有小妖精（雪碧图）！！！
CSS精灵技术（sprite） 小妖精 雪碧图精灵技术产生的背景上图所示为网页的请求原理图，当用户访问一个网站时，需要向服务器发送请求，网页上的每张图像都要经过一次请求才能展现给用户。然而，一个网页中往往会应用很多小的背景图像作为修饰，当网页中的图像过多时，服务器就会频繁地接受和发送请求，这将大大降低页面的加载速度。为了有效地减少服务器接受和发送请求的次数，提高页面的加载速度，出现了C...原创 2020-04-22 20:11:51 · 154 阅读 · 0 评论 -
一般人我都不告诉的CSS高级技巧！！！
CSS高级技巧CSS用户界面样式所谓的界面样式， 就是更改一些用户操作样式， 比如 更改用户的鼠标样式， 表单轮廓等。但是比如滚动条的样式改动受到了很多浏览器的抵制，因此我们就放弃了。鼠标样式cursor设置或检索在对象上移动的鼠标指针采用何种系统预定义的光标形状。cursor : default 小白 | pointer 小手 | move 移动 | text 文本...原创 2020-04-22 19:41:59 · 136 阅读 · 0 评论 -
用CSS让元素穿上隐身衣！！！
元素的显示与隐藏在CSS中有三个显示和隐藏的单词比较常见，我们要区分开，他们分别是 display visibility 和 overflow。它们的主要目的是让一个元素在页面中消失，但是不在文档源码中删除。 最常见的是网站广告，当我们点击类似关闭不见了，但是我们重新刷新页面，它们又会出现和你玩躲猫猫！！！display 显示display 设置或检索对象是否及如何显示。displ...原创 2020-04-22 19:30:18 · 151 阅读 · 0 评论 -
看了以后，你会发现CSS的定位（position）其实并不难！！！
定位(position)如果，说浮动， 关键在一个 “浮” 字上面， 那么 我们的定位，关键在于一个 “位” 上。PS: 定位是我们CSS算是数一数二难点的了，但是，你务必要学好它，我们CSS离不开定位，特别是后面的js特效，天天和定位打交道。不要抵触它，反而要爱上它，它可以让我们工作更加轻松哦！为什么要用定位？那么定位，最常运用的场景在哪里呢？ 来看几幅图片，你一定会有感悟！...原创 2020-04-21 20:13:55 · 257 阅读 · 0 评论 -
CSS--（float）浮动篇！！！
浮动(float)普通流(normal flow)这个单词很多人翻译为 文档流 ， 字面翻译 普通流 或者标准流都可以。前面我们说过，网页布局的核心，就是用CSS来摆放盒子位置。如何把盒子摆放到合适的位置？CSS的定位机制有3种：普通流（标准流）、浮动和定位。html语言当中另外一个相当重要的概念----------标准流！或者普通流。普通流实际上就是一个网页内标签元素正常从上...原创 2020-04-20 10:17:54 · 284 阅读 · 0 评论 -
听说CSS布局就是在摆盒子？一起来学习CSS的盒模型吧！！！
盒模型（CSS重点）其实，CSS就三个大模块： 盒子模型 、 浮动 、 定位，其余的都是细节。要求这三部分，无论如何也要学的非常精通。所谓盒子模型就是把HTML页面中的元素看作是一个矩形的盒子，也就是一个盛装内容的容器。每个矩形都由元素的内容、内边距（padding）、边框（border）和外边距（margin）组成。看透网页布局的本质网页布局中，我们是如何把里面的文字，图片，按照...原创 2020-04-20 09:40:51 · 793 阅读 · 0 评论 -
网页不好看怎么办？给网页加张好看的背景图吧！
CSS 背景(background)CSS 可以添加背景颜色和背景图片，以及来进行图片设置。background-color背景颜色background-image背景图片地址background-repeat是否平铺background-position背景位置background-attachment背景固定还是滚动背景的合写（复合属性）...原创 2020-04-20 09:16:44 · 762 阅读 · 0 评论 -
CSS的杀手锏！千万别错过了！！！
CSS 三大特性层叠 继承 优先级 是我们学习CSS 必须掌握的三个特性。CSS层叠性所谓层叠性是指多种CSS样式的叠加。是浏览器处理冲突的一个能力,如果一个属性通过两个相同选择器设置到同一个元素上，那么这个时候一个属性就会将另一个属性层叠掉比如先给某个标签指定了内部文字颜色为红色，接着又指定了颜色为蓝色，此时出现一个标签指定了相同样式不同值的情况，这就是样式冲突。一般情...原创 2020-04-19 21:46:18 · 94 阅读 · 0 评论 -
CSS怎样写得更规范？看这里！
CSS书写规范空格规范【强制】 选择器 与 { 之间必须包含空格。示例： .selector { }【强制】 属性名 与之后的 : 之间不允许包含空格， : 与 属性值 之间必须包含空格。示例：font-size: 12px;选择器规范【强制】 当一个 rule 包含多个 selector 时，每个选择器声明必须独占一行。示例：/* good */.post,.page,...原创 2020-04-19 21:34:38 · 121 阅读 · 0 评论 -
CSS标签显示模式（display）行盒、块盒、行块盒？
标签显示模式（display）非洲黑人： 皮肤内黑色素含量高，以吸收阳光中的紫外线，保护皮肤内部结构免遭损害，头发象羊毛一样卷曲，使每根卷发周围都有许多空隙，空隙充满空气，卷发有隔热作用。欧洲白人： 生活寒带或着是说常年温度较低的地缘,加上年日照时间少，身体的黑色素沉淀比较少``所以出现皮肤、发色、瞳晕都呈现浅色亚洲黄人： 我中间的。。。最重要的总结： 是为了更好的...原创 2020-04-19 21:24:52 · 325 阅读 · 0 评论 -
普通选择器不好使了？来看看这些更高级的吧！
CSS复合选择器复合选择器是由两个或多个基础选择器，通过不同的方式组合而成的,目的是为了可以选择更准确更精细的目标元素标签。交集选择器交集选择器由两个选择器构成，其中第一个为标签选择器，第二个为class选择器，两个选择器之间不能有空格，如h3.special。记忆技巧：交集选择器 是 并且的意思。 即…又…的意思比如： p.one 选择的是： 类名为 .one 的 ...转载 2020-04-19 21:15:44 · 168 阅读 · 0 评论 -
CSS--网页的Tony老师！！！
CSS的发展历程从HTML被发明开始，样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。随着HTML的成长，为了满足页面设计者的要求，HTML添加了很多显示功能。但是随着这些功能的增加，HTML变的越来越杂乱，而且HTML页面也越来越臃肿。于是CSS便诞生了。CSS 网页的美容师CSS的出现，拯救了混乱的HTML，当让更加...原创 2020-04-19 20:11:03 · 230 阅读 · 0 评论