CSS
flying_huixia
希望在编程的道路上一直进步,结识更多志同道合的人!
展开
-
CSS知识课堂
1、实现背景图片透明,图片之上的文字正常显示技术点有二:1、背景图片透明,其上的文字正常显示2、文字垂直居中显示分析:文字显示在背景之上,那么给文字的z-index:99; 文字是不定宽高的,用absolute+transform来实现难点:发现将中间内容的元素透明度设为0.5,文字也会继承此特性,变为0.5因此采用:::before伪类来实现...原创 2020-04-16 14:09:54 · 218 阅读 · 0 评论 -
数组乱序实现 & 懒加载 & http缓存
一、数组乱序实现方法一:实现算法性能不好ary.sort(function(){ return Math.random()>0.5?1:-1})方法二:var len = ary.length; for (var i = 0; i < len - 1; i++) { var index = parseInt(Math.random() * ...原创 2019-09-10 18:07:48 · 254 阅读 · 0 评论 -
z-index的使用小结
1、z-index定义z-index 属性指定一个元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。2、使用(1)必须在定位元素(position:relative/absolute/fixed/sticky)上才有效(2) 可以有负值(3)不同父元素的子元素之间进行显示时,会根据父级元素的z-index进行渲染.3、z-index不起作用的...原创 2018-10-23 17:30:33 · 35980 阅读 · 4 评论 -
html新增属性,css新增属性、js进阶知识点整理
一、HTML5新增属性语义化标签:article、footer、header、nav、section、asidearticle <article> 标签定义外部的内容。 外部内容可以是来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本。亦或是来自其他外部源内容。 header <header&g...原创 2018-09-05 20:46:14 · 913 阅读 · 0 评论 -
2018前端星计划 第一天笔记整理(html+css)
第一天 html与css1、什么是前端包含内容(1)运用web标准技术:html,css,js,svg,http(2)运行环境:浏览器PC端,手机移动端APP(3)界面与交互功能美观、无障碍(盲人群体)、安全(个人信息隐私)、性能(加载速度,动画显示等)、兼容性(pc端不同浏览器,手机端Android,IOS等)前端边界node.js服务器端替代java.phpelectron使用Web技术开发桌...原创 2018-05-08 17:10:14 · 933 阅读 · 0 评论 -
BFC块级格式化上下文
一、BFC概念介绍定义:BFC, 全称是block formatting context,它是一个独立封闭的渲染区域,在这个区域内的所有元素,从区域的顶部起,一个接一个地根据自身的布局特性进行排列:在这个区域内的块级元素 ,按从上到下的顺序显示,相邻的块级元素可以使用margin隔离,但在垂直方向上相邻的块级元素会发生margin合并;在这个区域内的inline-level或inline-bloc...原创 2018-05-04 10:04:17 · 214 阅读 · 0 评论 -
伪类选择器&&伪元素选择器
利用伪类选择器&&伪元素选择器可以为文档中不一定具体存在的结构指定样式,或者为某些元素的状态所指示的幻象类指定样式。(选自《CSS权威指南》 P57)一 伪类伪类就是一种虚构的状态或者说是一个具有特殊属性的元素可以使用CSS进行样式修饰。常见的几种伪类是: :link , :visited , :hover , :active ,:focus, :lang,:first-chi...原创 2018-04-08 14:36:32 · 553 阅读 · 0 评论 -
双飞翼布局和圣杯布局
圣杯布局其实和双飞翼布局是一回事。它们实现的都是三栏布局,两边的盒子宽度固定,中间盒子自适应,也就是我们常说的固比固布局。它们实现的效果是一样的,差别在于其实现的思想。1、 双飞翼布局html代码段 css布局代码段双飞翼布局,使用了浮动。#left元素的margin-left:-100%,指#main元素的宽度。这里的宽度是content-width;#right 元素的margin-left:...原创 2018-03-29 22:00:15 · 187 阅读 · 0 评论 -
响应式网页杂谈
1. 先介绍响应式网页的概念在不同的终端显示不同的网页,能够适应不同的设备.响应式WEB设计理念:页面的设计与开发应当根据用户行为以及设备环境进行相应的调整。(1)响应式网页的构成最重要是第三个(2)测试响应式网页快捷键f12(3)如何实现自适应网页Device-width//设备宽度Initial-scale=1//原始缩放比例为1User-scalable//用户不能对设备网页进行缩放(视...原创 2018-03-20 12:52:59 · 338 阅读 · 0 评论