xqhys的博客

目前，在大多数开发环境中，已经基本不用table元素来做网页布局了，取而代之的是div+css，那么为什么不用table系表格元素呢？1、用DIV+CSS编写出来的文件k数比用table写出来的要小，不信你在页面中放1000个table和1000个div比比看哪个文件大2、table必须在页面完全加载后才显示，没有加载完毕前，table为一片空白，也就是说，需要页面完毕才显示，而div是逐行显示，不需要页面完全加载完毕，就可以一边加载一边显示3、非表格内容用table来装，不符合标签语义化要求，

在实际开发中，我们经常遇见边框需要背景渐变的实现要求，那么如何去实现呢，今天给大家分享依稀几种情况1.直角的背景渐变 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 2...

/* WebKit browsers */input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color: #666;}/* Mozilla Firefox 4 to 18 */input:-moz-placeholder, textarea:-moz-placeholder {...

取值：$("#ID").val();控制大小：加width,height限制(style="width:100px;height:200px;");或row,col限制(<textarea rows="5" cols="7">);限制拖动： style="resize:none;"滚动条效果： style="overflow:s...

渐变就是多种颜色混合而成的效果，css3要实现渐变，就必须使用渐变函数来设置background或则background-imge属性。同时为了兼容各个浏览器（IE，safari，chrome，Firefox），还需要添加对应的带开发商前缀的渐变1，线性渐变a,使用linear-gradient（）函数可以创建渐变<style> #div1 { ...

select::-ms-expand { border: none; color: gray; background-color: transparent;}

最近老大让我调整xframe中图标，因为要换肤，所以我刚好学习一下换肤的原理，主要是参考这两篇文章使用Sass实现主题切换​www.jianshu.comVue中如何使用sass实现换肤(更换主题)功能​blog.youkuaiyun.com项目主要的目录如下图，只能放到这里再多就泄露代码了主要的文件有themeVariable.scss 主题变量variable.scss 主要是定义一些变...

@content这个是不是个类似占位用的，代表里面是自定义的的 @-webkit-keyframes #{$name} { @content; }`@content`用在`mixin`里面的，当定义一个`mixin`后，并且设置了`@content`；`@include`的时候可以传入相应的内容到`mixin`里面官网给的例子：$col...

SCSS 日常用法本文是以自己的理解起的结构，要看详细的帮助文档，参阅这里：https://sass-lang.com/documentation/你需要了解的less 和 sass 是两种 css 预编译语言，就是说通过 less 或者 scss 写的代码最终都会被编译成 css 再使用。其目的是为了更快、更结构的编写 css 文件，都能使用 变量、运算符、判断、方法等等。s...

CSS选择器用于选择你想要的元素的样式的模式。"CSS"列表示在CSS版本的属性定义（CSS1，CSS2，或对CSS3）。选择器 示例 示例说明 CSS .class .intro 选择所有class="intro"的元素 1 #id #firstname 选择所有id="firstname"的元素 1 * * ...

一、Flex布局是什么？Flex是Flexible Box的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。.box{ display: flex;}行内元素也可以使用Flex布局。.box{ display: inline-flex;}Webkit内核的浏览器，必须加上-webkit前缀。.box{ ...

一直都在看站友们的作品，今天也来给大家分享一个小的效果，第一次发还有点小紧张呢，语言表达能力不是很好，还请见谅…先来个简单点的吧，上效果图刚开始在网上看到效果图的时候感觉好神奇，当我试着写出来的时候发现，哇！原来这么简单，我这脑袋瓜咋没反应过来呢，所以整理了下顺便简化了分享出来，希望对大家有帮助。<div class="demo"></div><s...

背景实际项目中，一般都会遇到不同颜色的图标，例如导航栏图标的不同状态方法方法1需要UI设计师给出不同颜色的图标，在不同状态下设置不同的元素背景。.icon { background-image: url(./home.png);}.icon.active { background-image: url(./home-active.png);}...

最近有点忘了position几个取值的内容，在这里简单总结一下。　　position的含义是指定位类型，取值类型可以有：static、relative、absolute、fixed、inherit和sticky，这里sticky是CSS3新发布的一个属性。1、position: static　　static(没有定位)是position的默认值，元素处于正常的文档流中，会忽略left、...

&lt;div style="text-align: center;"&gt; &lt;div style="display: inline-block;"&gt;&lt;/div&gt; &lt;div style="display: inline-block;"&gt;&lt;/div&gt;&lt;/div&gt;tex

（1）子元素不继承父元素透明，采用下面方法：.opacity{background: rgba(0,0,0,.7);}（2）子元素会继承父元素透明1>.opacity{background: #000；opacity：0.7}2>.opacity{background:#000000;filter:alpha(Opacity=80);-moz-opacity:0.8;opaci

table布局 height=100%无效分析在使用table表格进行页面布局时，经常使用将表格高度设置style="height:100%"来实现表格高度满屏效果，但在最新的浏览器中经常遇到无效，根本原因再于浏览器使用用的工作模式的不同造成的；在Firefox与IE8标准模式下，HTML与Body标签默认是没有高度（即高度为0） ，而是根据其中的内容自适应，如果设置表格的style="h

第一：CSS的4种引入方式CSS的4种引入方式是：行内样式、内嵌样式、链接样式、导入样式 1.行内样式最直接最简单的一种，直接对HTML标签使用style=""，例如：缺点：HTML页面不纯净，文件体积大，不利于蜘蛛爬行，后期维护不方便。 2.内嵌样式内嵌样式就是将CSS代码写在之间，并且用进行声明，例如：