![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
文章平均质量分 69
AwsuEver
这个作者很懒,什么都没留下…
展开
-
CSS清除浮动的几种方法
什么是清除浮动?在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外面而影响(甚至破坏)布局的现象。这个现象叫浮动溢出,为了防止这个现象的出现而进行的CSS处理,就叫CSS清除浮动。下面是一个没有清除浮动的例子:.news { backg...原创 2018-09-20 11:10:09 · 171 阅读 · 0 评论 -
浅谈box-sizing属性
前言初学 css 的时候 div 的一些宽高问题经常会引起一些不好理解的问题,这里做一个关于css盒模型的分享。 问题 下面的代码可以直接复制出去运行哦<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>cs转载 2018-10-25 10:44:09 · 492 阅读 · 0 评论 -
css中形形色色的画图
在CSS中画图用border的属性来完成,今天我们就来看看利用CSS怎样绘制出好看又实用的图CSS border 属性定义和用法border 简写属性在一个声明设置所有的边框属性。可以按顺序设置如下属性:border-width border-style border-color如果不设置其中的某个值,也不会出问题,比如 border:solid #ff0000; 也是允...转载 2018-10-19 19:08:30 · 397 阅读 · 0 评论 -
CSS中的Flex布局
在了解Flex布局前我们先看一看传统的布局:布局的传统解决方案,基于盒子模型,依赖 display 属性 + position 属性 + float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现 下面就该Flex布局登场了:2009年,W3C 提出了一种新的方案----Flex 布局,可以简便、完整、响应式地实现各种页面布局。目前,它已经得到了所有浏览器的支持,这意味着...原创 2018-10-19 14:36:31 · 166 阅读 · 0 评论 -
CSS中的布局方式(两栏布局、三栏布局)
此文章转载自:https://blog.csdn.net/crystal6918/article/details/55224670方法一:浮动布局&lt;div id = "aside"&gt;&lt;/div&gt;&lt;div id = "main"&gt;&lt;/div&gt;转载 2018-10-15 20:39:57 · 1386 阅读 · 1 评论 -
CSS中的BFC详解
这篇文章是我对BFC的理解和借鉴其他优秀文章中的一些总结,希望让大家有收获。一、何为BFC BFC(Block Formatting Context)格式化上下文,是Web页面中盒模型布局的CSS渲染模式,指一个独立的渲染区域或者说是一个隔离的独立容器。二、形成BFC的条件 1. float 除了none以外的值 2. overflow 除了visib...原创 2018-10-18 17:05:46 · 361 阅读 · 0 评论 -
CSS实现水平垂直居中
1:设置margin:auto方法这个方法使用了一个 position:absolute,有固定宽度和高度的 div。这个 div被设置为 top:0; bottom:0;。但是因为它有固定高度,其实并不能和上下都间距为 0,因此 margin:auto; 会使它居中。使用 margin:auto;使块级元素垂直居中是很简单的。#out{ width: 200px; h...原创 2018-10-12 20:27:43 · 193 阅读 · 0 评论 -
CSS3动画开发指南之逐帧动画
最近在公司开发的项目中需要用到多个图片逐帧动画的效果,参考了他人的博客,在这里写出来记录一下(主要是我对自己转头就马什么梅的记忆力没信心)什么是逐帧动画维基百科中的定义: 定格动画,又名逐帧动画,是一种动画技术,其原理即将每帧不同的图像连续播放,从而产生动画效果。简而言之,实现逐帧动画需要两个条件:(1)相关联的不同图像,即动画帧;(2)连续播放。 了解了什么是逐帧...原创 2019-01-28 16:52:57 · 661 阅读 · 0 评论