自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(18)
  • 收藏
  • 关注

原创 圣杯布局

<style> .left, .right { width: 300px; height: 300px; background-color: aquamarine; } .center { height: 500px; ...

2019-08-16 19:51:28 70

原创 盒子模型

<style> div{ width:400px; height: 300px; background-color: orange; border: 15px solid blue; /* 内边距,控制内容与边界的距离 */ padding: 25px; /* 外...

2019-08-16 19:49:12 82

原创 双方旋转

<style> * { box-sizing: border-box; } html { height: 100%; } body { margin: 0; height: 100%; ...

2019-08-16 19:47:26 116

原创 魔方

<style> * { box-sizing: border-box; } html { height: 100%; } body { margin: 0; height: 100%; ...

2019-08-16 19:46:17 96

原创 时钟

<style> * { box-sizing: border-box; } html { height: 100%; } body { height: 100%; margin: 0; ...

2019-08-16 19:43:47 85

原创 浮动 元素切换

浮动 float1:浮动后:元素本身脱离文档流,原来的位置被其他元素所占据2:浮动后;在同一个父元素中,目标元素回占据一个浮动后位置。3:注意:浮动只能是;子元素在容器中进行位置移动。如果父容器剩余宽度不能容纳两一个子元素,那么久换行。** 目标元素的浮动范围:父容器4:同一位置多个元素;具有浮动属性的元素;层级高于不惧有浮动属性的元素总结;浮动规律:第一步元素在布局流中的起始位置,第...

2019-08-16 19:37:36 146

原创 html,css基础

标签上title属性与alt属性的区别是什么?alt属性是为了给那些不能看到你文档中图像的浏览者提供文字说明的。且长度必须少于100个英文字符或者用户必须保证替换文字尽可能的短。这包括那些使用本来就不支持图像显示或者图像显示被关闭的浏览器的用户,视觉障碍的用户和使用屏幕阅读器的用户等。title属性为设置该属性的元素提供建议性的信息。使用title属性提供非本质的额外信息。.请写出至少5...

2019-08-16 19:27:18 47

原创 盒子模型

盒子模型组成元素: magin 边框与其他盒子的距离 magin变大 盒子不会变化,盒子与盒子之间的距离会变大padding 是边框与内容区域的距离 标准盒子 padding变大 盒子变大border 盒子的边框content 标准盒子 为 width 和heightie盒子:content = width - padding-left - padding-right - bo...

2019-08-14 21:38:39 60

原创 定位 浮动

背景属性 background背景:我们可以想象为;盒子的底面,我们可以给这个底面左任何涂鸦,例如;颜色 图片;多个图片;颜色+图…backgroud-image: url() 设置背景图片;值可谓多个;用逗号分开background-size: 设置背景图片大小;值一横向 值二纵向background-position 设置背景图片位置 值一 水平方向移动 值二竖直方向移动bac...

2019-08-14 21:34:42 83

原创 弹性布局

弹性布局display:fixed弹性布局特点:1:优点:可以解决复杂的布局问题 缺点IE不兼容弹性布局改变是父容器的布局方式;有默认的流逝布局变为弹性布局简洁改版子元素的属性;块变为行内块主轴:默认为盒子水平方形;可以通过属性改变主轴方向交叉轴:与主轴垂直的及时交叉轴flex-directionflex-wrapflex-flowjustify-contentali...

2019-08-14 21:32:09 318

原创 盒子 复合属性 单位

盒子补充1.只要是盒子,在盒子内部都会有布局流,也就是流失布局2. 在写页面布局的时候,尽量利用布局流,因为在使用布局的时候 父元素高度可以由子元素撑起来,可以避免兼容性问题3.如何搭建盒子与盒子之间的关系复合属性margin padding border…凡是在浏览器解析的时候;出现倒三角的属性,都是复合属性;单位绝对单位- 单位是固定的,不可改变的- px m cm相对单...

2019-08-14 21:29:51 366

原创 css基础4

css1基本语法结构选择器{属性:值;}选择器作用:选中标签对其进行样式美化属性作用:对元素进行样式美化值作用:决定属性美化样式的程度注意:css中的属性与html元素行内属性不是一个东西css选择器元素选择器html标签:选中所有对应的html标签.class 选中具有class行内属性的标签#id选中所有具有id行内属性的标签*选中所有元素id...

2019-08-14 21:26:53 90

原创 css基础3属性,伪类,集合选择器

选中元素name属性为sumit的标签选中元素input属性为login的标签<style> input[name=submit]{ width: 100px; height: 30px; } input[name=login]{ width: 300px; height: 30px; ...

2019-08-14 21:20:04 160

原创 css基础2关系选择器

1.>父子选择器 #content>header { height: 50px; background-color: darkgoldenrod }选中#content下所有的a标签:多代的 空格子代选择器设置字体大小 font-size #content a { color: black; ...

2019-08-14 21:06:09 97

原创 css基础

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...

2019-08-12 09:08:25 125

原创 会动的水晶球

* { /* 修改标签和模型类型 */ box-sizing: border-box; } html { height: 100%; } body { margin: 0; height: 100...

2019-08-12 09:03:56 178

原创 html基础

##课前准备学习准备1:熟悉自己使用的开发工具作用:编写代码 目的:做网站 做页面…2:熟悉浏览器,每个人电脑不同的浏览器主流浏览器 谷歌 火狐 360 QQ非主流浏览器 IE8以下浏览器3:熟悉浏览器的控制台###开发工具vscode webstrom subline Hibude…浏览器:###文件后缀xxx.html 是html 文件 作用写网页的。 浏览器可以解析...

2019-08-12 08:58:37 74

原创 常见html标签

常见html标签认识html元素根据用途分类布局类标签:页面布局文本类标签只要跟文字有关的;就用以下标签标题在一个页面中,h1标签只能出现一次,其他标题标签 可以出现多次 h1-h6 标题级别依次降低,字体依次减小图片类标签 作用:加载图片链接类标签:作用:跳转链接表格类标签 ;表单标签 作用:表单提交,录入信息,登录注册等认识html元素html 是标签lang 是html标签的属性 作用...

2019-08-10 15:28:48 342

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除