CSS
文章平均质量分 88
oneheart初心
这个作者很懒,什么都没留下…
展开
-
解决img和div高度不同的问题(img额外产生的高度)
问题:img在div中会在底部产生额外的空隙<style> div { color: #fff; background-color: blue; } img { background-color: #fff; }</style><body> <div class="content"> <img class="img" src="../../images/nature-1原创 2020-12-20 00:20:33 · 2310 阅读 · 1 评论 -
html元素高度塌陷的几种情况
1. html元素高度塌陷的几种情况子元素浮动(float)绝对定位(absolute)固定定位(fixed)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"> <titl原创 2020-12-11 10:28:59 · 347 阅读 · 0 评论 -
CSS3之渐变,转换,过渡,动画
1. 渐变1.1 线性渐变linear-gradient()函数<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style>原创 2020-11-16 00:35:17 · 233 阅读 · 0 评论 -
CSS3之选择器
1. 基本选择器<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> /* 标签选择器 */ div原创 2020-11-15 20:50:39 · 387 阅读 · 0 评论 -
CSS3之背景和边框
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><style> body { backgrou原创 2020-11-14 21:22:52 · 81 阅读 · 0 评论 -
盒子垂直水平居中的七种方法
一、直接及算法1. margin =(父盒子宽度 - 子盒子宽度)/ 2<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style&原创 2020-11-07 18:00:42 · 392 阅读 · 0 评论 -
CSS盒子模型box-sizing属性详解
1.content-boxchrome浏览器默认的盒子属性值。content-box的width和height从content算起,不包含border和padding。2.border-boxIE浏览器默认的盒子属性值。border-box的width和height从border算起,包含border和padding<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8" />原创 2020-11-03 01:36:57 · 12364 阅读 · 0 评论