css
关注
分享
扫一扫
时光之里
Before Dawn
展开
-
css礼花特效
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>css3实现烟花特效</title> <style> * { margin: 0; padding: 0; } html{ width: 100原创 2020-11-16 10:01:17 · 1234 阅读 · 0 评论 -
css动画阴影渐变效果
图片 hover 效果.img { width: 100%; height: 100%; background-image: url("../../../styles/image/example.png"); background-repeat: no-repeat; background-size: 100% auto; background-position: 50%...原创 2019-12-02 15:00:23 · 1262 阅读 · 0 评论 -
文本超出省略单行多行问题
单行、多行文本截断问题<div class="box"> <p> 会计师的科技感深加工IE给大家是个我经费等四个技术第三款共计四个积分都交给你电视剧覅二斌发给 </p></div>单行文本省略```css.box { width: 200px;}p { text-overflow: ellipsis; wh...原创 2019-12-02 14:58:01 · 183 阅读 · 0 评论 -
css实现固定的图片比例
css 实现 16:9 的图片比例需求：最近产品要求不管原图的大小是多少，宽度一定，高度要自自适应为 16:9。分析：对于正常的固定好宽度大小，这个需求很容易解决，直接通过人工计算，根据宽度的数值计算好高度的数值，然后 css 直接设置高度就行了。这样当然简单。可是现在在移动开发的过程中，我们为了自适应不同大小的屏幕，通过设置百分比来定宽，这样 css 无法通过计算得出这个固定的高度。当...原创 2019-12-02 14:54:42 · 3788 阅读 · 0 评论 -
css全局变量声明
:rootcss 伪类，匹配文档的根元素 ， 可以用于声明全局 css 变量CSS/CSS3 原生变量 var:root { --PC: @primary-color;}body { color: var(--PC);}注意：作用域问题原创 2019-12-02 14:51:02 · 1302 阅读 · 0 评论 -
20190401 网页布局中的自适应与响应式
自适应根据不同的屏幕设备设计不同的样式，自适应网页也被称为逐渐增强的网站。渐进增强 Progress enhancement先实现一个满足大部分设备基础功能的版本，然后，针对性的兼容的增加一些新功能和新特性，逐步的拓展应用。图片自适应(1)设置最大宽度和高度 max-width: 100%；目的是为了避免放大图片后图片失真。(2)针对不同的屏幕尺寸给出相应的图片响应式通...原创 2019-04-01 18:39:26 · 154 阅读 · 0 评论 -
使用 grid+媒体查询做响应式的例子
使用 grid+媒体查询做响应式<div class="wrapper"> <div>1</div> <div>2</div> <div>3</div></div>.wrapper { /* 使用网格布局 */ display: grid; /* 行和列的间距 */ ...原创 2019-04-01 18:23:16 · 374 阅读 · 0 评论 -
css 面试盘点
伪类选择器/* 选择最后一个元素 */last-child /* 选择偶数项 */nth-of-type(2n)原创 2019-03-13 19:03:20 · 130 阅读 · 0 评论 -
表格的行列转换
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>js_网页表格行和列互换效果</title><style type="text/css">table原创 2018-04-23 15:40:00 · 2596 阅读 · 2 评论 -
常见的CSS浏览器兼容及解决方案
常见的浏览器兼容以及css问题ie6横向margin加倍产生因素：块属性、float、有横向的margin解决方法：display:inlineie6下默认的行高解决方法：overflow:hidden 、 flont-size:0 、 line-height:xx pxie6不支持fixed解决方法/*对于非IE6可以这样写*/#top{ position:fixed;原创 2017-06-25 18:59:23 · 336 阅读 · 0 评论