![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
文章平均质量分 65
w狼子
自己的学习经验总结与记录。
展开
-
关于表格的HTML和CSS知识
关于表格的结构这里就不予介绍。表格的HTML属性及其作用(仅列出HTML5支持的属性):border: 该属性应用于table标签上,其决定表内部边框是否显示,属性值为1(其实属性值无所谓,只要声明了border属性就会显示内部边框,只是标准推荐为1)。当然在table、th、td上使用css样式‘border’也可决定表内部边框是否显示。colspan和rowspan: 该属性应用于单元格...原创 2018-03-23 19:12:06 · 395 阅读 · 0 评论 -
css实现元素居中的方法汇总
css实现居中的方法有非常多,所以这里不会全部列举。就选择自己比较喜欢的几种居中方式介绍一下。推荐几篇关于“css居中”的文章供大家深入学习:一、css垂直居中的11种方式二、六种实现元素水平居中的方式三、Centering in CSS:A Complete Guide(国外大牛) 简要介绍一下(详细应用可参考上面的三篇文章)。 水平居中:方法一:margin:0...原创 2018-03-29 21:10:05 · 184 阅读 · 0 评论 -
关于浮动你不得不知道的知识
首先你得知道浮动属性出现的初衷是“为了实现文字环绕图片的效果”,只是后来被用在了“不正当的方面”。以下是我总结的16条关于浮动的规则。1.css允许浮动任何元素,且浮动的元素会从正常的文档流中脱离出来,不过它仍然会影响布局。2.浮动元素周围的外边距不会合并,不管周围的margin是否是浮动元素的都不会合并。3.如果浮动一个非替换元素(比如链接),该元素的宽度会尽可能的小。4.浮动元素的包含块是其最...原创 2018-03-31 01:35:32 · 405 阅读 · 0 评论 -
css3新增属性:多列(column)
css3多列能够创建多个列来对文本进行布局,就想报纸那样。关于多列的相关属性及属性值如下:column-count: number|auto;:指定元素应分为的列数。column-fill: 指定如何填充列 balance:(默认)列的高度尽量均衡 auto: 顺序填充内容高度可能差距很大。column-gap: 指定列之间的间距。 length: 一个指定的长度,将设置列之间的差距 nor...原创 2018-04-08 21:10:55 · 503 阅读 · 0 评论 -
两种方式实现CSS动画
实现CSS动画有两种主要的方法:过渡动画(transition)和animation动画。第一种:过渡动画(transition)。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>CSS动画之transition</tit原创 2018-04-16 00:25:26 · 7049 阅读 · 0 评论 -
css清除浮动的方法汇总
浮动在css中是非常重要但也是引起很多莫名问题的罪魁祸首,所以我们对它可谓又爱又恨。下面是我总结的几种清除浮动的方式(其中第一种是最常用的方式,很多大型网站都用到过):提醒读者:全文所有的实例代码都只有些微几行不同,为了让读者更清楚理解才在每个例子中都展现了完整代码。清除浮动方式一:父级div定义伪类:after 结合使用zoom兼容低版本IE<!DOCTYPE html><h...原创 2018-03-28 20:36:09 · 348 阅读 · 0 评论 -
多个CSS样式到底谁起作用
首先得知道css有三个特性:继承、层叠、优先级。这三个特性在决定选择器谁起作用时有考虑的优先顺序。 具体这三者是怎样影响选择器的请参考权威文档。这里我就只用大白话的形式告诉一些基本常识。 在考虑到底哪个css样式起作用时,先考虑继承,再考虑优先级,最后考虑层叠。 怎样个考虑法呢? 第一步:直接选中优先于间接选中。即选择器直接选中元素时指定的样式优先于继承下来的样式。 第二步:若多个样式都是直接选中...原创 2018-04-12 21:10:55 · 1264 阅读 · 0 评论 -
CSS技巧积累
积累的一些css技巧**1.彩色图片显示为黑白图片。filter属性**img{ filter:grayscale(100%); -webkit-filter:grayscale(100%); -moz-filter:grayscale(100%); -ms-filter:grayscale(100%); -o-filter:grayscale(100%);}/*参考filte...原创 2019-09-09 15:27:39 · 245 阅读 · 0 评论