- 博客(12)
- 收藏
- 关注
原创 Vue脚手架
@vue/cli是Vue官方提供的一个全局模块包(得到vue命令),此包用于创建脚手架项目; 脚手架是为了保证各施工过程顺利进行而搭设的工作平台; 脚手架的好处:开箱即用(拿来就用); 零配置webpack(支持babel,支持css.less.图片.字体的打包,支持开发服务器); 使用它的目的:在vue脚手架的基础上,快速开发;@vue/cl的安装:npm -g i @vue/cli ------ yarn global add @vue/cli; 在终端输入vue(不报错),vue ..
2021-10-22 01:35:16 96
原创 背景的属性,元素的显示模式7.25
背景的属性:背景图像 :url背景图片的路径, bgi;background-image:url(./heka.jpg); background-repeat:no-repeat; repeat默认值水平和垂直平铺; no-repeat不平铺; repeat-x水平方向平铺; repeat-y垂直方向垂直; background-position:300px200px; 背景定位<位置>控制背景图片的位置:...
2021-08-19 16:17:50 102
原创 滚动条,响应式,元素的显示与隐藏8.15
滚动条的使用: 你想让谁滚动,就在外面再给它包一个盒子,让外面这个盒子的宽度比较小(外面盒子不可以和里面盒子一样宽); 再给外面盒子加css代码:overflow:auto/scroll; oveflow默认值是visibility; 理解:滚动条其实不是在自身的元素身上,而是在它的父盒子身上;...
2021-08-16 12:15:51 292
原创 学习flex布局的总结8.14
Flex布局的组成部分:1.弹性容器(父级,添加display:flex的盒子);2.弹性盒子(子级);3.主轴(默认水平);4.侧轴(默认垂直);主轴的对齐方式:justify-contentcenter:居中;space-between:间距出现在弹性盒子之间;space-evenly:父子级间距都相同;space-around:间距出现在弹性盒子的两侧;侧轴的对齐方式:align-itemscenter:居中;stretch:默认值,拉升;Flex布局步骤:1.找到父子关系,给父元素盒子
2021-08-14 20:23:35 164
原创 rem,flexible的认识8.12
如果一个项目既不会放大,也不会缩小,那就给它设置flex:none; 如果一个容器里,只有一个项目是自适应的,那就应该给这个项目设置flex:auto; 如果一个容器里,有多个项目自适应,那就应该使用flex:数字;...
2021-08-14 20:16:29 121
原创 子,后代,交,并集,伪类选择器7.23
子代选择器: 父与子的关系是用>表示仅仅用来突出显示儿子并且只能是父亲和儿子; p>span{color:blue ; font-size:100px};后代选择器: .box.cx{color:blue;font-size:400px;}; .父元素在前 ,所有子元素在后, 用空格来表示后代选择器的使用; 后代选择器只精准和作用"后代的所有选择器"; 交集选择器: p.box{color:blue;font-size:20...
2021-08-14 19:51:02 71
原创 Flex布局8.11
设置主轴方向:主轴默认是水平方向,侧轴默认是垂直方向; 1.给父盒子设置display:flex;父盒子一般称为容器,子元素一般称为项目; 2.给容器或者项目添加属性,目的是为了控制项目在容器中的大小和位置; 注意:主轴和侧轴永远保持垂直,项目永远按照主轴的方向进行排列(重要!);容器属性:设置主轴方向:flex-direction:column; row:(默认值)行,水平,使用概率99%; column:列,垂直,使用概率99%; row-reverse:行,从右向左,概率很小..
2021-08-11 20:17:32 95
原创 动画的位移.旋转.呈现等8.7
过渡延迟:transition:height2s2s,width2s3s; 多个属性之间用逗号隔开,第二个值代表的是过渡延迟;注意:行内元素添加转换无效;注意:加了转换的盒子层级会提高,很像加了相对定位;注意:绝对定位的盒子父元素有了转换,盒子偏移参考父元素;空间位移: perspective:1000px; 视距:是屏幕距眼睛的距离,添加到父元素上,取值800-1200px; transform:rotateX(100px); 有X,...
2021-08-08 23:53:54 131
原创 选择器和字体的设置7.22
css初始:div{color:blue;font-size:40px;} css属性, color属于属性名,biue属于属性值,冒号分号应用英文; 字体粗细:font-weight:700; normal=400bold=700数值后面不带单位; 字体倾斜:font-style:italic; normal默认值不倾斜, italic倾斜; 字体实体: 空格符<小于号&...
2021-08-06 19:56:27 246
原创 有序,无序,表格,表单7.20
HTML基础列表 有序列表 <ol><li></li></ol> ol里面只能包含li,但li里面可以包含任何内容; 无序列表 <ul><li></li></ul> ul里面只能包含li,但li里面可以包含任何内容; 自定义列表 <dl><dt></dt><dd></dd></dl> dt是小标题,dd是解
2021-08-06 19:15:42 81
原创 图片的位移,旋转,缩放等8.6
字体图标基本使用: 第一种方法 注意: 在iconfont网站里面找想要的图片,下载完图片要解压,要找对路径;将下载的字体文件夹改名为iconfont,放在文件夹里边; 链入iconfont.css样式表文件; 在demo_index.html里面找到unicode编码,粘贴图标对应的unicode编码; 给标签调用iconfont类名; 第二种方法(更简单) 将下载的字体的文件夹放到项目目录里边; 链入iconfont.css样式表文件; 给需要使用的字体图标的标签调用ic
2021-08-06 19:01:14 145 2
原创 HTML认知7.19
文字加粗 可以用<strong>文字加粗</strong>来表示 网页的标题 <tittle>标题</tittle> 网页的主体内容 <body>内容</body> 注释的内容 为代码添加解释性、描述性信息,浏览器会忽略不解析的 ctrl+/ 标签的属性 可以给标签添加附加信息; 格式:属性名="属性值"; 标签的属性写在开始标签内部; 标签上可以同时存...
2021-08-05 00:57:57 72
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人