CSS
关注
分享
扫一扫
sleepwalker_1992
这个作者很懒，什么都没留下…
展开
-
svg图标点击后出现边框问题解决方法
svg图标点击后出现边框问题解决方法原创 2023-02-15 16:30:38 · 1785 阅读 · 1 评论 -
自适应宽高的盒子中文本垂直水平居中
问题：如何让span中的文字在div中垂直水平居中？方法一：display:table;和display:table-cell;给父元素div设置position: absolute;display:table;这样，div就会撑满整个浏览器屏幕;给需要居中的元素span设置display:table-cell;vertical-align:middle;这样，span就...原创 2018-06-11 22:29:00 · 1056 阅读 · 0 评论 -
未知大小的图片在固定宽高的盒子中居中
问题：图片大小未知，如何让图片在div中居中给div设置一个背景颜色，方便观察居中效果 div{ background-color: lawngreen; } 让图片在div中水平居中的方法 div{ text-align: center; }...原创 2018-06-11 23:19:08 · 1163 阅读 · 0 评论 -
CSS——display属性
所有主流浏览器都支持 display 属性。注释：如果规定了 !DOCTYPE，则 Internet Explorer 8 （以及更高版本）支持属性值 "inline-table"、"run-in"、"table"、"table-caption"、"table-cell"、"table-column"、"table-column-group"、"table-r原创 2018-06-05 22:14:50 · 180 阅读 · 0 评论 -
CSS——text-align和vertical-align
text-align属性指定元素文本的水平对齐方式。默认值：left if direction is ltr, and right if direction is rtl继承：yes版本：CSS1JavaScript 语法：object.style.textAlign="right"属性值值描述left把文本排列到左边。默认值：由浏览器决定。right把文本排列到右边。center把文本排列到中间...原创 2018-06-09 16:24:07 · 917 阅读 · 0 评论 -
CSS 文本属性
CSS 文本属性color设置文本颜色direction设置文本方向。letter-spacing设置字符间距line-height设置行高text-align对齐元素中的文本text-decoration向文本添加修饰text-indent缩进元素中文本的首行text-shadow设置文本阴影text-transform控制元素中的字母unicode-bidi设置或返回文本是否被重写 verti...原创 2018-06-09 16:43:52 · 1737 阅读 · 0 评论 -
CSS ——text-decoration和text-indent
text-decoration 属性规定添加到文本的修饰。注意： 修饰的颜色由 "color" 属性设置。默认值：none继承：no版本：CSS1JavaScript 语法：object.style.textDecoration="overline"属性值none默认。定义标准的文本。underline定义文本下的一条线。overline定义文本上的一条线。line-through定义穿过文本下的...原创 2018-06-09 16:52:50 · 409 阅读 · 0 评论 -
如何用CSS写一个全屏的“品”字
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin: 0;原创 2018-07-02 10:12:59 · 451 阅读 · 0 评论 -
css布局两边固定中间自适应的五种方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &原创 2018-09-21 15:37:23 · 5783 阅读 · 0 评论 -
css布局中间固定两边自适应
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &原创 2018-09-22 16:25:18 · 555 阅读 · 0 评论 -
小div在大div中水平垂直居中（两个div都固定宽高）
方法一：儿子绝对定位或相对定位，这样儿子脱离标准流，父亲有固定宽高，用儿子的margin去挤父亲<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> ...原创 2018-06-11 20:13:06 · 11855 阅读 · 0 评论 -
display: none；和visibility:hidden;的区别
置换元素display: none；display: none；不为被隐藏的对象保留其物理空间；visibility:hidden;所占据的空间位置仍然存在,仅为视觉上的完全透明；display: none和visibility:hidden的区别就是visibility:hidden会保留元素的空间repaint(重绘) ，repaint发生更改时，元素的外观被改变，且在没有改变布局的情况...原创 2018-05-23 22:24:54 · 1663 阅读 · 0 评论 -
CSS text-transform
text-transform：none； 默认。定义带有小写字母和大写字母的标准的文本。text-transform：capitalize ；文本中的每个单词以大写字母开头。text-transform：uppercase ；定义仅有大写字母。text-transform：lowercase； 定义无大写字母，仅有小写字母。text-transform：inherit ；规定应该从父元素继承 te...原创 2018-05-22 14:07:02 · 286 阅读 · 0 评论 -
CSS——清除浮动的办法
<div> <ul> <li>北京</li> <li>上海</li> <li>广州</li> <li>深圳</li> </ul> </div> &原创 2018-05-08 21:51:05 · 1140 阅读 · 0 评论 -
CSS ——浏览器兼容问题
第一，IE6，不支持小于12px的盒子，任何小于12px的盒子，在IE6中看都大解决办法很简单，就是将盒子的字号，设置小（小于盒子的高），比如0px。1 height: 4px;2 _font-size: 0px; 我们现在介绍一下浏览器hack。hack就是“黑客”，就是使用浏览器提供的后门，针对某一种浏览器做兼容。IE6留了一个后门，就是只要给css属性之前，加上下划线，这个属性就是IE6认识...原创 2018-05-12 19:51:47 · 309 阅读 · 0 评论 -
CSS盒模型之margin
margin的塌陷现象margin 盒子居中margin：0 auto原创 2018-05-08 23:15:19 · 475 阅读 · 0 评论 -
CSS——font属性
三行语句： font-size: 14px; 字体大小 line-height: 20px; 行高 font-family: "宋体"; 字体● 可以使用font属性，将字号、行高、字体，一起设置。则上面三行语句等价于： font: 14px/20px “宋体”; line-height: 20px ;行高20px；文本在行里面垂直居中；想要单行文本垂直...原创 2018-05-09 10:37:07 · 1509 阅读 · 0 评论 -
CSS——超级链接 伪类
超级链接就是a标签。2.1 伪类也就是说，同一个标签，根据用户的某种状态不同，有不同的样式。这就叫做“伪类”。类就是工程师加的，比如div属于box类，很明确，就是属于box类。但是a属于什么类？不明确。因为要看用户有没有点击、有没有触碰。所以，就叫做“伪类”。伪类用冒号来表示。a标签有4种伪类，要求背诵：1 a:link{2 color:red;3 }4 a:visited{5...原创 2018-05-12 19:52:20 · 2363 阅读 · 0 评论 -
CSS——bacground系列属性
background-image:url(images/wuyifan.jpg);background-repeat属性background-repeat:no-repeat; 不重复background-repeat:repeat-x; 横向重复background-repeat:repeat-y; 纵向重复background-position属性background-posi...原创 2018-05-09 13:13:56 · 1996 阅读 · 0 评论 -
CSS——定位
定位有三种，分别是：相对定位、绝对定位、固定定位。相对定位不脱离标准文档流，绝对定位和固定定位使元素脱离标准文档流。相对定位：position:relative;绝对定位：position:absolute;固定定位：position:fixed;1、相对定位相对定位，多用于微调元素位置。让元素相对于自己原来的位置，进行位置调整。例如：position:relative; 先声明自己要进行相对定...原创 2018-05-09 17:01:22 · 477 阅读 · 0 评论 -
CSS选择器
回顾CSS选择器CSS选择器回顾符号说明用法#idId选择器#id{ color:red; }.class类选择器.class{ //}Element标签选择器P { //}*通配符选择器配合其他选择器来使用,并集选择器div,p{} 空格后代选择器div span{}选择div下面所有后代的span>子代选择器div > span{}+紧邻选择器div+p选择div紧挨着的下一个p元...原创 2018-05-17 10:32:28 · 164 阅读 · 0 评论 -
CSS盒模型之padding和border
一个盒子的主要属性有五个：width、height、padding、border、margin。width是“宽度”的意思，CSS中width指的是内容的宽度，而不是盒子的宽度。height是“高度”的意思，CSS中height指的是内容的高度，而不是盒子的高度padding是“内边距”的意思border是“边框”margin是“外边距”1、paddingpadding的区域有背景颜色，css2....原创 2018-05-08 17:43:23 · 1366 阅读 · 0 评论 -
CSS块级元素和行内元素
（1） 块级元素霸占一行，不能与其他任何元素并列；可以设置宽、高如果不设置宽度，那么宽度将默认变为父亲的100%。（2） 行内元素与其他行内元素并排；不能设置宽、高。默认宽度就是文字宽度。在HTML中将标签分为：文本级、容器级两大类：文本级：p、span、a、b、i、u、em容器级：div、h系列、li、dt、ddCSS元素分类：块级元素：div、h系列、li、dt、dd、p 所有的容器级标签...原创 2018-05-08 18:05:28 · 523 阅读 · 0 评论 -
CSS——脱离标准流方法一：浮动
浮动是css里面布局用的最多的属性。浮动语句：float:left; 左浮动float:right; 右浮动1、没有浮动的时候2、两个盒子都左浮动浮动的元素脱标，那么就能并排了，并且能够设置宽高了。一个span标签如果浮动，不需要转成块级元素，就能设置宽度、高度。浮动的所有标签已经不区分行内、块了。浮动的元素互相贴靠。3、两个盒子都右浮动4、浮动的元素有“字围”效果 <div>盒子...原创 2018-05-08 20:35:25 · 2539 阅读 · 0 评论