css
文章平均质量分 89
徐小七七
技术,不断更新,才有趣嘛。
展开
-
CSS三大特性继承性,层叠性,优先级
一、继承性1)什么是继承性?给父元素设置一些属性,子元素/后代也可以使用,这个我们称之为继承性。2 ) 并不是所有属性都可以继承的,那么有哪些属性具有继承性? 只有以color/font-/text-/line开头属性才可以继承3) 继承性特殊性a标签的文字颜色和下划线是不能继承的h标签的文字大小是不能继承的4)继承性应用场景一般用于设置网页上的一些共性信息,例如网页的文字颜色,字体原创 2017-07-04 18:08:44 · 2590 阅读 · 0 评论 -
vue项目使用postcss-pxtorem(应用于vue-cli 2和3)
vue-cli 2:1、安装插件yarn或者npmnpm install postcss-pxtorem或者yarn add postcss-pxtorem2、编辑项目根目录下.postcss.js文件(没有则新建一个)module.exports = { "plugins": { "postcss-import": {}, "postcss-url": {},...原创 2019-04-29 17:37:48 · 2678 阅读 · 1 评论 -
CSS 代码在线生成工具,让你少写几百行代码~
以下资源是完全免费的web应用,可用于生成图案、渐变、甚至浏览器前缀属性的CSS3代码。如果你写的是前端代码,然后这些资源可以为你节省大量的时间,并为今后的项目工作提供可重复片段。一、 CSS3 Generator大家最喜爱的用于代码生成的web应用之一就是CSS3 Generator。对于不同类别的代码生成器,包括RGBa,transform,flexbox等等,它有不同的页面。另外,...原创 2018-04-13 12:04:53 · 18714 阅读 · 0 评论 -
Flex 布局
网页布局(layout)是 CSS 的一个重点应用。布局的传统解决方案,基于盒状模型,依赖 display 属性 + position属性 + float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现。2009年,W3C 提出了一种新的方案—-Flex 布局,可以简便、完整、响应式地实现各种页面布局。目前,它已经得到了所有浏览器的支持,这意味着,现在就能很安全地使用转载 2018-01-31 11:51:45 · 247 阅读 · 0 评论 -
Less 编写css,速度快多了!!!
一、变量变量允许我们单独定义一系列通用的样式,然后在需要的时候去调用。所以在做全局样式调整的时候我们可能只需要修改几行代码就可以了。 // LESS@color: #4D926F;#header { color: @color;}h2 { color: @color;}/* 生成的 CSS */#header { color: #4D926F;}h2 { color:原创 2017-12-01 15:53:59 · 462 阅读 · 0 评论 -
CSS基础-清除浮动
清除浮动盒子高度问题在标准流中内容的高度可以撑起盒子的高度<style> div{ background-color: red; } p{ width: 200px; height: 100px; background-color: blue;原创 2017-07-18 16:55:34 · 303 阅读 · 0 评论 -
CSS基础-定位
转载:17-CSS基础-定位相对定位什么是相对定位?相对定位就是相对于自己以前在标准流中的位置来移动 格式:position: relative; 示例程序<style> *{ margin: 0; padding: 0; } div{ width: 100px;原创 2017-06-22 16:16:05 · 504 阅读 · 0 评论 -
stylus入门使用方法
stylus是个什么鬼?对于开发来说,CSS的弱点在于静态化。我们需要一个真正能提高开发效率的工具,LESS, SASS都在这方面做了一些贡献。Stylus 是一个CSS的预处理框架,2010年产生,来自Node.js社区,主要用来给Node项目进行CSS预处理支持,所以 Stylus 是一种新型语言,可以创建健壮的、动态的、富有表现力的CSS。比较年轻,其本质上做的事情与 SASS/LESS 等类原创 2017-06-22 16:07:57 · 3861 阅读 · 1 评论 -
程序员有用网站集(干货)
IT互联网|程序员|移动开发|web前端-学习网站JSawesome-javascript - 一系列很棒的javascript 库,资源。star:9000+fullPage - 非常好用的全屏滑动库,看 Demo 就明白Swiper - 强大的 Slider 库 其实这类效果库非常多,但文档能那么专业的就很少鸟requirejs - JS模块化是构建复杂项目的第一步 中文学习文档奉上:R原创 2017-06-22 18:08:41 · 1932 阅读 · 0 评论 -
CSS基本选择器
一、标签选择器什么是标签选择器?根据指定的标签名称, 在当前界面中找到所有该名称的标签, 然后设置属性 格式:标签名称{ 属性:值;}注意点: 标签选择器选中的是当前界面中所有的标签, 而不能单独选中某一个标签 标签选择器无论标签藏得多深都能选中二、id选择器什么是id选择器?根据指定的id名称找到对应的标签, 然后设置属性 格式:#id名称{ 属性:值;}注意点: 每个HTM原创 2017-06-23 11:37:55 · 333 阅读 · 0 评论 -
CSS选择器之【组合选择器】
前言组合使用不同的选择器可以匹配更特定的元素。有的复合选择器能将目标样式应用到更多元素,有的复合选择器则会锁定更少元素,总之会让你的选择非常具体。复合选择器主要包括:群组选择器、后代选择器、子选择器和同级元素选择器。一、群组选择器群组选择器的使用范畴是,多个选择器使用同一个样式或者同一组样式。这在做CSS样式初始化,CSS框架设计以及后期CSS代码优化时会经常使用。多个选择器之间用逗号(,)隔开,其原创 2017-06-23 11:42:25 · 521 阅读 · 1 评论 -
CSS选择器之【伪类/元素选择器】
前言目前为止,我们已经学习了如何使用HTML文档中定义的元素选择文档的内容。CSS中还定义了伪选择器,它们提供了更复杂的功能,但非直接对应HTML文档应以的元素。伪选择器主要分两种:伪元素和伪类。一、伪元素选择器1):first-letter 该类选择器主要用于向指定的选择器添加指定的效果。选择“块级元素”文本段落中的首个字符,只能对“块级元素”生效。 首先,元素的display计算值必须是 blo原创 2017-06-23 11:48:07 · 693 阅读 · 0 评论 -
CSS 小技巧 & 滚动条样式更改
1.使用CSS复位CSS复位可以在不同的浏览器上保持一致的样式风格。您可以使用CSS reset 库Normalize等,也可以使用一个更简化的复位方法:*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0;}现在元素的 margin 和padding 已为0,box-sizing可以管理您的C...原创 2019-04-25 09:52:11 · 682 阅读 · 0 评论