css
-
详解css的四种书写方式介绍
优先级: 外部样式 优先级,即:同名的选择器右边的会覆盖左边 1.内部样式表 /*内部样式表,一般用于覆盖公用样式*/ #headTip { color: 0xff5; } 2.使用link标签,在文档中声明使用外接资源,最常用的一种方式。 立即学习“前端免费学习笔记(深入)”; css外部样式表指…
-
详解css绝对定位对元素宽度的影响



一、问题来源 自己编写轮播图切换的时候前一幅图滑动时后边出现空白直到前一幅图全部滑出后第二幅图才出现。刚开始出现问题到网上搜发现有的说定时器动画可能会造成这种情况,于是我在代码调试里注释掉了定时器,让图片只走一步就停下来,发现后边还是有空白,所以确定不是定时器的问题。于是我查看了一下盒模型…
-
详解css的外边距margin的使用
这篇文章详解css的外边距margin的使用 h2{margin:10px 0;}p{margin:20px 0;}……这是一个标题 这是又一个标题本例中,第一个h2的margin-bottom(10px),p的margin-top(20px),第二个h2的margin-top(10px)…
-
使用CSS制作简易3D效果旋转木马实例代码
最近看一下css3d的一些特性,想着也实验学习一下,制作个小demo之类的。就练习了一下。开发一个粗糙的选择木马效果,如图 其实就是找到角度和位置,计算每根柱子的旋转角度摆放到3d空间的置顶位置即可。然后利用css的animate属性让3d舞台无线旋转,就有了一简易的旋转木马效果。感兴趣的可以看一下…
-
使用css改变下拉列表select框的默认样式介绍
这篇文章使用css改变下拉列表select框的默认样式介绍 原理 原理是将浏览器默认的下拉框样式清除,然后应用上自己的,再附一张向右对齐小箭头的图片即可。当然右侧的小箭头可以用伪元素before或者after来实现。 select { /*Chrome和Firefox里面的边框是不一样的,所以复写了…
-
使用CSS实现Footer置底的五种方式
页脚置底(Sticky footer)就是让网页的footer部分始终在浏览器窗口的底部。 当网页内容足够长以至超出浏览器可视高度时,页脚会随着内容被推到网页底部;但如果网页内容不够长,置底的页脚就会保持在浏览器窗口底部。 方法一:将内容部分的margin-bottom设为负数 footer htm…
-
移动端css单位之 “vh” & “vw”的分别介绍
一、前言: 响应式web设计离不开百分比。但是,css百分比并不是所有的问题的最佳解决方案。css的宽度是相对于包含它的最近的父元素的宽度的。但是如果你就想用视口(viewpoint)的宽度或者高度,而不是父元素的,那该怎么办? 二、“vh” & “vw”: vh:相对于视窗的高度:视窗高度…
-
css背景有关的属性详细介绍



印象中css控制背景的就一个background,但是background是一个复合属性 它包括: background-color:背景颜色,css支持的颜色表示方法,都可以用 background-image:背景图片(url) background-repeat:背景是否重复(repeat、n…
-
css超出2行部分省略号解决方法
今天做东西,遇到了这个问题,百度后总结得到了这个结果。 首先,要知道css的三条属性。 overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; //溢出不换行 立即学习“前端免费学习笔记(深入…
-
CSS定位position使用介绍
position选项来定义元素的定位属性,选项有5个可选值:static、relative、absolute、fixed、inherit 属性值为relative、absolute、fixed时top | left | right| bottom | z-index才能起作用。 static(默认值…