When ?-CSDN博客

传统网页布局的三种方式1.普通流（标准流/文档流）2.浮动3.定位为什么需要浮动浮动可以改变元素标签默认的排列方式。最经典的应用：可以让多个块级元素一行内排列显示。浮动float属性用于创建浮动框，将其移动到一遍，直到左边缘或右边缘触及包含块或另一个浮动框的边缘。div{ float: none;/*默认*/ float: left;/*元素向左浮动*/ float: right;/*元素向右浮动*/}浮动特性1.浮动元素会脱离标准流（脱标）。2.浮动的元素会一行内显示并且

2021-04-11 15:33:03 157

原创阴影效果

盒子阴影使用box-shadow属性为盒子添加阴影。div{ box-shadow: 10px 10px 10px 10px rgba(0,0,0,.3); /*透明度30%*/}注意：1.默认是外阴影（outset），但是不可以写这个单词，否则导致阴影无效。可以改为内阴影（inset）2.盒子阴影不占用空间，不会影响其他盒子的排列。文字阴影使用text-shadow来设置。...

2021-04-10 15:08:02 98

原创圆角边框

圆角边框div{border-radius: 10px;/*半径参数可以为像素值或百分比*/}圆形由正方形，将数值修改为高度或宽度的一半即可，或者直接写50%round { width: 200px; height: 200px; border-radius: 100px;}round { width: 200px; height: 200px; border-radius: 50%;}圆角矩阵如果是矩形，设置高度的一半即可re { width: 400px;

2021-04-10 14:09:40 90

原创 CSS盒子模型

盒子模型border边框边框宽度：border-width边框颜色：border-color边框样式：border-style: solid 实线dashed 虚线dotted 点线div {width: 30px;height: 200px;border-width: 5px;border-style: solid;border-color: pink;}边框复合写法border: 1px solid red;边框分开写法border-top: 5px solid

2021-04-09 17:04:12 66

原创 CSS笔记（5）

CSS三大特性层叠性相同的选择器给设置相同的样式，此时一个样式就会覆盖（层叠）另一个冲突的样式。1.样式冲突，采取就近原则，那个样式离结构近，就执行哪个样式。2.样式不冲突，不会重叠。继承性子标签会继承父标签的某些样式（text,font,line-这些元素开头的，以及color属性）行高的继承body {font: 12px/24px 'Microsoft YaHei'}body {font: 12px/1.5 'Microsoft YaHei'}div {font-siz

2021-03-29 18:46:51 59

原创 CSS笔记（4）

CSS的背景背景颜色background-color: transparent;一般情况下，元素背景颜色默认为transparent（透明色），我们也可以手动指定背景颜色为透明色背景图片一些logo或者一些装饰性的小图片或是一些差大的背景图片。优点是非常便于控制位置。注意：背景图片会压住背景颜色。background-image: none;background-image: url(images/logo,png);背景平铺默认情况下是平铺的。background-repeat

2021-03-29 17:45:10 69

原创 CSS笔记（3）

CSS的元素显示器元素显示模式块元素常见h1,p,ul,div等。1.比较霸道，自己独占一行。2.高度，宽度，外边距，内边距都可以控制。3.是一个容器盒子，里面可以放行内元素或者块级元素。4.宽度默认是父级元素的100%注意：文字类型元素内不能使用块级元素，如p，h1等。行内元素（内联元素）常见a，span等。1.一行可以显示多个。2.高宽直接设置无效。3.默认宽度就是它本身内容的宽度。4.行内元素只能容纳文本或其他行内元素。注意：链接里面不能再放链接。特殊情况链接a里面可以

2021-03-29 10:38:06 116

原创 CSS笔记（2）

Emmet语法它使用缩写，来提高html/css的编写速度。快速生成HTML结构语法1.生成标签，输入标签名，按Tab。2.生成多个标签，例如div*4 Tab3.父子关系，ul>li Tab4.并列关系 div+p Tab5.如果生成带有类名或者id名的，直接写.demo或#two Tab6.如果生成的div类名是有顺序的，可以用自增符号$.demo$*5 再按下tab键 <div class="demo1"></div> <di

2021-03-27 15:10:29 88

原创 CSS笔记（1）

html只能写一些简单的样式CSS层叠样式表（Cascading Style Sheets）选择器{具体样式（键值对）}给谁该样式{改什么样式}<head> <style> p{ color:red; font-size:12p; } </style></head>注意：加分号。CSS代码风格展开格式样式小写空格规范：1.属性值的前面，冒号后面保留一个空格。2.选择器和花括号中间保留一个空格。基

2021-03-26 19:19:10 108 1

原创 HTML笔记

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！这是你第一次使用 Markdown编辑器所展示的欢迎页。如果你想学习如何使用Mar

2021-03-26 15:23:49 146 2

mkijn的博客

原创 miniUI

原创浮动