![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
金牌战五渣
一个小菜鸡程序猿,主要记录一些平时自己遇到的问题。
展开
-
css伪类和伪元素的区别
1、伪类伪类选择元素基于的是当前元素处于的状态,或者说元素当前所具有的特性,而不是元素的id、class、属性([])等静态的标志。由于状态是动态变化的,所以一个元素达到一个特定状态时,它可能得到一个伪类的样式;当状态改变时,它又会失去这个样式。由此可以看出,它的功能和class有些类似,但它是基于文档之外的抽象,所以叫伪类。:link伪类将应用于未被访问过的链接,与:vi原创 2017-09-13 10:53:26 · 500 阅读 · 0 评论 -
父级元素透明,子级元素不透明
html:二维码已失效点击刷新CSS:.imgr{position: relative;width: 160px;height: 160px;}.div2{position: absolute;top: 0;left: 0;z-index: 10;width: 100%;height: 160px;ba原创 2017-09-14 09:45:48 · 876 阅读 · 0 评论 -
针对IE的CSS hack
1、情形一h1{font-size: 20px;color: #E08E0B;color: #F00\0;color: #00A4EA\9\0;+color: #72C472;_color: #999;}这种情况下各种IE的表现形式为:IE11:#F00;IE10 : #00A4EA;IE9 : #00A4EA;IE8 : #F00;原创 2017-09-12 16:18:36 · 250 阅读 · 0 评论 -
IE9父容器overflow:auto时,子容器状态更改导致滚动条下出现额外空间的问题
IE9父容器overflow:auto时,子容器状态更改导致滚动条下出现额外空间的问题代码<style> .panel{ width: 200px; overflow: auto; background-color: #f00; } .inner{ ...转载 2018-04-02 15:29:06 · 322 阅读 · 0 评论 -
能兼容到IE7的 线性渐变(linear-gradient)
能兼容到IE7的 线性渐变(linear-gradient)效果展示 代码&amp;lt;p class=&quot;horizontal&quot;&amp;gt;水平渐变&amp;lt;/p&amp;gt;&amp;lt;p class=&quot;vertical&quot;&amp;gt;垂直渐变&amp原创 2018-05-16 10:05:03 · 3606 阅读 · 0 评论 -
css3制作图标
使用css3制作常用的图标1. 弯曲箭头2. 六角星3. 五角星4. 五边形5. 心形6. 阴阳7. 电视8. shape-outside1. 弯曲箭头#curvedarrow { position: relative; width: 0; border-top: 90px solid transparent; border-right: 90px solid red; t...原创 2019-03-14 14:06:00 · 986 阅读 · 0 评论 -
移动端页面横屏和强制横屏适配
前言在移动端中我们经常碰到横屏竖屏的问题,那么如何去判断或者针对横屏、竖屏来写不同的代码呢。首先在head中加入如下代码:<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>一、...原创 2019-06-19 15:44:44 · 4669 阅读 · 1 评论