- 博客(13)
- 收藏
- 关注
RSS订阅原创 弹性盒子与布局
进行弹性盒子的设置最主要的是改变主轴的方向，不用设置主轴的排列方式，元素占取剩余空间时，会将它旁边的盒子推过去。进行分布布局的实现可以通过弹性盒的改变主轴方向等方式，实现图片文字的居中对齐弹性盒子的注意事项压缩只存在于主轴方向上，交叉轴不会发生压缩悬挂式布局弹性盒子中图片的大小不改变设置：可以通过align-self的属性值来调整图片的位置，避免图片的大小改变多列column-count 分栏个数 将区域进行分割column-width 分栏的宽度 不能与上面的属性进
2021-08-03 21:14:54
198
原创 3D转换及弹性盒子
3D转换就是增加了空间Z轴translateZ()往Z轴移动scaleZ()沿着Z轴缩放rotateZ()translate3d(X轴位移的距离,y轴位移的距离,z轴位移的距离)scale3d(x轴缩放的大小,y缩放的大小,z轴缩放的大小)rotate3d(0/1,0/1,0/1,旋转角度)当功能函数的变量值为1时执行旋转度数弹性盒子弹性盒子的转变 display：flex在父元素上进行设置的值f...
2021-08-02 22:15:51
88
原创 CSS3中的2D转换
在CSS3中的2D转换中引入了移动、旋转、缩放、倾斜、矩阵及景深，在这主要介绍一下，移动、旋转、缩放、倾斜2D转换所用的标签是transform ，直译的意思是变形的意思，最能体现其功能的是进行3D的转换效果，今天主要介绍其在平面状态下的变换在2D下我们要进行元素的移动，要使用的标签是translate，其使用语法如下所示transform: translate(120px,200px);在其前面的值为X方向的值，第二个值为Y轴方向的值，当两个值写在一起时，他默认合并执行，在进行过渡效果展
2021-08-01 15:31:19
125
原创 渐变与过渡
线性渐变:方向默认从上到下语法:background:linear-gradient(2~多个颜色，颜色中间用逗号分隔);linear-gradient(to方向[1到2两个],2~多个颜色，颜色中间用逗号分隔)linear-gradient(度数deg,2~多个颜色，颜色中间用逗号分隔)加浏览器内核方向:方向没有to直接跟的方位【两个方向的时候浏览器加内核的识...
2021-07-29 21:39:59
146
原创 H5新增的语义化标签CSS3新增盒子阴影及文字阴影
header 头部标签 就是一个具有语义化的标签 可以像div一样设置宽与高等属性 当高度设置为百分比时，文字的垂直居中的解决方法 通过定位的方法来进行实现，可以设置绝对定位，也可以设置相对定位，绝对定位较为简单，但是是文档脱离标准流，会使后面的处理变得不方便，谨慎使用 可以通过给父元素添加一个display：table属性，对子元素添加display：table-cell；vertical-align：middle的方法也可以实现文字的居中显示...
2021-07-28 20:54:00
227
原创 选择器与BFC
一，基础选择器1， 通配符Class选择器(类选择器)必须在元素中定义class属性 .classsId选择器 必须在元素中定义id属性 #id元素选择器（标签选择器）标签名群组选择器 选择器之间用逗号分隔，有相同属性的元素可以放到一起，减少代码量。层次选择器包含选择器（后代选择器） 选择所有【空格前面元素包含的】的带有空格之后的元素标签（元素 元素）子选择器 选择的就是下一级【也就是自己的亲儿子】 （元素>元素）相邻兄弟选择器（兄弟选择器）...
2021-07-27 21:31:30
53
原创 表单元素及HTML5中新增表单控件
input 输入表单元素<input type="属性值"/>type属性值text文本框 输入任何文字password 密码框radio 小圆点CheckBox 复选框name属性值 定义input的名称value 规定input的值checked 单选和复选可以设置 规定此input的在加载时就已经选中maxlength 最大的输入值，字符数submit 是提交按钮 可以通过value来修改按钮中的值reset 是清除所有的表单数据butto...
2021-07-26 21:26:15
283
原创 CSS中元素之间的转换
元素之间的相互转化：1.什么是元素之间的相互转化：元素类型之间的相互变化在理解元素类型之间的转化之前，首先应该了解都有什么元素类型在CSS标签中，将元素的类型分为三类块级元素：div p ul li ol li dl dt dd h1-h6特点：1.独自占据一行2.可以设置宽度和高度3.可以设置text-align行内元素：a b em i span strong特点：1.不能独自占据一行2.除了img之外都不能设置宽度和高度3.不能用text-align[...
2021-07-24 20:58:46
663
原创 表格标签的属性
表格的主要作用是用于展示数据，以便于对数据进行整理它的基本语法是利用 <table> </table>标签来定义表格标签<tr> </tr>是表格中行的标签，在表格中没有列的概念，只有单元格利用<td></td>来表示单元格其中<th></th>表示标头单元格，标头单元格中的文字会加粗，并且居中显示，突出其重要性。表格的属性 一定要写在table标签中才能实现align 用于改变表格的对齐..
2021-07-23 20:45:19
402
原创 侧拉列表、定位
关于display 转化的延伸部分，当display的属性值为none的时候，其就会隐藏起来，这可以让我们实现侧边导航栏的操作，下面讲一下侧边导航栏的制作首先是建立一个主题的结构 创建一个盒子 在盒子中加入一个段落标签， 在段落标签中加入超链接标签与一定数量的span标签，按需要重复上述3、4操作 在css中对样式进行修改 清除浏览器自带的内外边距，超链接标签的下划线，并设置超链接标签的字体颜色 设置盒子的高度、宽度、行高、文字的水平对齐 将超链接标签转化为块元素，并将其浮动起来 将s.
2021-07-20 19:52:00
86
原创 学习CSS的字体、列表、背景的修饰
在css中我们首先要学习的是对于字体的修饰其中修改字体的大小可以通过font-size来进行修饰，对于字体的修改可以利用font-family来进行修改，在Chrome浏览器中，默认字体是微软雅黑，字号为16px，我们在写样式的时候可以通过通配符选择器给页面一个默认的字号与字体，这是为了更好的用户体验。字体的样式可以通过font-style来进行修改，它的属性值有italic与oblique都是用来使字发生倾斜作用，关闭倾斜作用可以通过normal来实现。字体的颜色可以通过color标签来实现，
2021-07-15 19:21:16
277
原创 学习表单标签与基础CSS标签
表单用来收集用户信息，将收集到的信息反馈与服务器中表单标签的语法结构是<form> <input type=“text" placeholder="用于提示的语句" ></form>type用于定义输入框的类型常用的有以下几类文本框 text 密码框 password 提交框 submit 按钮 button 重置按钮 reset除此以外还有value属性规定输入字段的初始值<inp...
2021-07-14 20:12:44
126
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人