前端
文章平均质量分 86
Ibabysit
这个作者很懒,什么都没留下…
展开
-
前端学习笔记10
前端学习笔记10一、过渡属性过渡属性 transition 是实现css动效的属性。transition: 属性名称 动画持续时间 运动曲线 延迟时间;我们可以来写一下代码:div{ width: 200px; height: 200px; background: skyblue; transition: height 2s linear 1s;}div:hover{ height: 300px;}如何单独控制transition的某个属性值:原创 2021-09-07 17:43:15 · 167 阅读 · 1 评论 -
前端学习笔记9
前端学习笔记9一、垂直对齐以前我们讲过让带有宽度的块级元素居中对齐,是margin: 0 auto;以前我们还讲过让文字居中对齐,是 text-align: center;但是我们从来没有讲过有垂直居中的属性, 我们的妈妈一直很担心我们的垂直居中怎么做。vertical-align 垂直对齐, 这个看上去很美好的一个属性, 实际有着不可捉摸的脾气,否则我们也不会这么晚来讲解。vertical-align : baseline |top |middle |bottom 设置或检索对象内容的垂原创 2021-09-07 17:41:02 · 87 阅读 · 0 评论 -
前端学习笔记8
前端学习笔记8一、清除浮动1.1、清除浮动的本质我们之前说到浮动,介绍说同级盒子要么都浮动,要么都不浮动,主要是因为,如果同级下有的盒子浮动,有的盒子不浮动,会造成浮动的盒子影响了不浮动的盒子原来所在位置。简言之,就是浮动会对布局造成影响。而清除浮动,清除的是浮动后造成的影响。如果按照我们之前说的,同级下所有的盒子都浮动,而父级没有高度,则父级元素会因为子级浮动而使高度变为0(因为子级盒子都 “浮” 起来了)。如下图:左右盒子的浮动影响了下面没有浮动的蓝色盒子的位置。<head>原创 2021-09-07 17:36:04 · 176 阅读 · 0 评论 -
前端学习笔记7
前端学习笔记7一、固定定位fixed固定定位是绝对定位的一种特殊形式,它以浏览器窗口作为参照物来定义网页元素。当position属性的取值为fixed时,即可将元素的定位模式设置为固定定位。当对元素设置固定定位后,它将脱离标准文档流的控制,始终依据浏览器窗口来定义自己的显示位置。不管浏览器滚动条如何滚动也不管浏览器窗口的大小如何变化,该元素都会始终显示在浏览器窗口的固定位置。固定定位有两点:固定定位的元素跟父亲没有任何关系,只认浏览器。固定定位完全脱标,不占有位置,不随着滚动条滚动。ie6原创 2021-09-07 17:30:41 · 304 阅读 · 0 评论 -
前端学习笔记6
前端学习笔记6学习目标 能够完成爱宠知识案例 能够书写圆角属性 能够书写不透明度属性 能够完成老师在课堂上完成的企业网的进度一、圆角属性border-radius: 50%;/*圆角效果 推荐大家给50%*/ 可以给盒子宽度的一半,如果盒子宽度变了还要来改值,比较麻烦,推荐给50%代表盒子一半二、不透明度opacity和rgba都有不透明的效果opacity:0.5—半透明,取值范围0-1 (最小值是0,最大值是1)0就是100%透明,1就是纯色opacity是原创 2021-09-05 22:16:31 · 93 阅读 · 0 评论 -
前端学习笔记5
前端学习笔记5学习目标 能够说出网页布局的三大流派 能够利用浮动属性解决盒子的并排问题 能够在photoshop中进行简单操作(包括量取距离、切图等操作) 能够完成老师在课堂上完成的企业网的进度网页布局经验:页面的稳定性:1.优先使用width和height2.其次使用padding,虽然说padding会改变盒子的占位大小,但是padding没有其他的问题3.最后使用margin,margin有塌陷的问题。 实际开发中: 怎么方便就怎么来一、网页布局的三大流派标原创 2021-09-05 22:10:55 · 106 阅读 · 0 评论 -
前端学习笔记4
前端学习笔记4一、无效链接的写法项目中在开发阶段,通常会把a标签的href属性设置为无效链接,格式可以有一下几种:<a href="javascript:void(0);">叩丁狼</a><a href="javascript:;">叩丁狼</a><a href="#">叩丁狼</a>二、注释注释的作用:1、对附近代码块进行注解说明 ;2、屏蔽不想要执行的代码html的注释方式: <!-- 注释语句 -->原创 2021-09-05 22:07:44 · 81 阅读 · 0 评论 -
前端学习笔记3
# 前端学习笔记3学习目标 能够说出CSS的三种书写位置 行内式 内嵌式 外链式 能够写出实体化三属性的三个css属性 width height background-color 能够说出标签的3种显示模式和他们的特点 块级 行内 行内块 display:block/ inline/ inline-block 能够说出CSS有哪些复合选择器 后代选择器 .box p 并集选择器 .box1,.box2,.bo原创 2021-09-05 22:04:19 · 237 阅读 · 0 评论 -
前端学习笔记2
前端学习笔记2一、列表(掌握) ☞ 无序列表(unordered-list) <ul> <li> 列表项 </li> <li> 列表项 </li> ... </ul> 总结: 1. ul列表必须直接包含的标签是li 2. 在li标签中可以包含其他任何标签 3. 在展示数据的时候没有先后顺序的要求 例如: <ul> &l原创 2021-09-05 21:54:04 · 109 阅读 · 0 评论 -
前端学习笔记1
前端学习笔记1一、认识前端前端历史UI:作图、做成简单HTML页面前端:html+css+js, vue/react/Ag后端:java/PHP/Python/C#/javascript js NodeJs(服务器程序)网页:信息展示前端发展 及其就业网页网站开发后台管理系统网页游戏开发移动端页面开发微信小程序、公众号、订阅号微信小游戏APP 混合式开发二、认识网页网页组成网页是由: 文字,图片,输入框,按钮,视频,音频....元素组成的总结: 网页就是由原创 2021-09-05 21:40:47 · 291 阅读 · 0 评论