![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
web
文章平均质量分 50
玺影儿
网页网站开发
2. 后台管理系统
3. 网页游戏开发
4. 移动端页面开发
5. 微信小程序、公众号、订阅号
6. 微信小游戏
7. APP 混合式开发
会C语言,Java,web,小程序,公众号编辑及文稿,有网站相关作品,校内推文作品。
展开
-
实时更新Visual Studio Code工具与浏览器HTML修改同步更新_live_server的使用
这两个是一样的127.0.0.1:5500/MI/index.html与localhost:5500/MI/index.html。实时更新Visual Studio Code工具与浏览器HTML修改同步更新_live_server的使用。(路径相当于已经搭建了一个服务器,可以实时更新,就不需要再手动刷新了)127.0.0.1等于localhost,都是本地意思。4、点击Open with Live Server。2、在搜索框输入live ser,点击下载。观察,原本的路径url,与现在的区别。原创 2024-07-29 18:37:17 · 154 阅读 · 0 评论 -
缩放响应式网站重点实例“CSS媒体查询案例”
一、CSS媒体查询案例。原创 2024-07-29 17:52:08 · 110 阅读 · 0 评论 -
javascript变量
使用`var`这个单词,告诉浏览器,我们要定义一个变量,使用`=`号告诉浏览器,我们要把左边的数据存储到变量里面。如果我们使用prompt()方法让用户输入了数据,我们又想要把用户输入的数据保存起来,怎么办呢?//计算两个数字的和。在JavaScript中有一种专门用于保存数据的语法:**变量**当我们想使用这个数据的时候,就可以直接使用这个变量代替这个实际数据。上面代码中,`200`被称为变量`b`的`值`变量定义分为两个过程:变量声明和变量赋值。var 变量名 = 数据;变量就是存储数据的容器。原创 2024-07-20 14:51:56 · 165 阅读 · 0 评论 -
响应式的原理是CSS3媒体查询,响应式的框架Bootstrap
目前移动端页面主流的处理方式是:pc端用响应式原理来书写,移动端做成自适应的效果(例如: [www.taobao.com](http://www.taobao.com) 和 m.taobao.com)响应式页面原理:**根据浏览器窗口的宽度,来加载不同的样式代码css**,从而使元素在不同分辨率下有完好的展示效果 (需要检测这个宽度)/*在大于等于600px且小于等于1000px的时候,渲染这里的css代码:*//*当浏览器宽度**大于等于1000px**的时候渲染这里面的代码,例如:*/原创 2024-07-19 23:01:46 · 406 阅读 · 0 评论 -
手机端的适配(重点)
根据W3标准 ,em 单位是相对于使用em单位的元素的字体大小( 也是相对于字体大小,有可能是父亲的元素也有可能是自身的元素字体大小 )每个网页默认都会有一个**视口**,视口其实是一个**虚拟的窗口** ,**移动端**默认的尺寸是**980**像素;使用em单位时,像素值是em值乘以使用em单位的元素的字体大小( `像素px=em值 * fontSize大小`)为了兼容移动设备,一般让**网页视口的宽度和设备的宽度的比例为 1:1 , 并且不允许用户缩放网页**;原创 2024-07-19 22:55:18 · 790 阅读 · 0 评论 -
移动web介绍(了解)
侧重点:pc端的兼容和适配,pc端的事件(鼠标)用手机端 消费 的人越来越多。1.1、PC端开发 VS 移动web开发。使用的技术:html css js。使用的技术:html css js。侧重点:手机端适配,移动端事件(触摸)京东双十一销售额( 2015 )京东双十一销售额 ( 2016 )3.2、为什么学习移动web。一、移动web介绍(了解)原创 2024-07-17 17:01:25 · 200 阅读 · 0 评论 -
less的使用
less是一种css 的预处理语言,简化了css的书写,增强了css的功能,赋予css动态语言的特点,是css的升级版。/*书写一个宽300px,高200px的盒子(设计图宽度为75)*///width: @w - 200px;2.2、less嵌套。原创 2024-07-17 16:58:09 · 522 阅读 · 0 评论 -
animation动画属性
往复运动:表示是否往复执行动画,如是,则值为 `alternate`, 如否,则不写。animation: 动画名称 动画持续时间 运动曲线 重复次数 往复运动;重复次数:没有单位,值为数值。如果是无数次,值为 `infinite`。其中,0%和100%可以写为 `from` 和 `to`。过渡属性 `animation` 是实现css动效的属性。运动曲线:值多为 `linear`。100% { css状态 }@keyframes 动画名称 {50% { css状态 }0% { css状态 }原创 2024-07-17 16:54:10 · 209 阅读 · 0 评论 -
构建立体面案例
底面原创 2024-07-17 16:52:56 · 269 阅读 · 0 评论 -
css开门案例
css3属性perspective(可以理解为 人眼到物体的距离)(一般我们会给700px~1500px);原创 2024-07-17 16:51:52 · 178 阅读 · 0 评论 -
transition过渡属性
我们可以通过 transform-origin 这个属性配合旋转来控制元素的旋转中心点和旋转轴。配合Transform:rotate()做旋转中心点的设置,两个值,单位可以是px %配合Transform:rotateY()/rotateX()做旋转轴的设置。转换属性 `transform` 可将元素进行旋转、位移和缩放等转换。过渡属性 `transition` 是实现css动效的属性。值为数值,值与值之间以空格隔开,无单位。值与值之间以空格隔开,单位为deg。值与值之间以空格隔开,单位为px。原创 2024-07-17 16:49:59 · 291 阅读 · 0 评论 -
CSS3新属性
往复运动:表示是否往复执行动画,如是,则值为 `alternate`, 如否,则不写。如果是无数次,值为 `infinite`。转换属性 `transform` 可将元素进行旋转、位移和缩放等转换。过渡属性 `transition` 是实现css动效的属性。其中,0%和100%可以写为 `from` 和 `to`。过渡属性 `animation` 是实现css动效的属性。值为数值,值与值之间以空格隔开,无单位。运动曲线:值多为 `linear`。值与值之间以空格隔开,单位为deg。原创 2024-07-17 16:46:08 · 382 阅读 · 0 评论 -
HTML圣杯布局
右</div><div class="child left">左原创 2024-07-17 16:42:38 · 198 阅读 · 0 评论 -
滑动门又叫推拉门
为了使各种特殊形状的背景能够自适应元素中文本内容的多少,出现了CSS滑动门技术。它从新的角度构建页面,使各种特殊形状的背景能够自由拉伸滑动,以适应元素内部的文本内容,可用性更强。制作网页时,为了美观,常常需要为网页元素设置特殊形状的背景,比如微信导航栏,有凸起和凹下去的感觉,最大的问题是里面的字数不一样多,咋办?核心技术就是利用CSS精灵(主要是背景位置)和盒子padding撑开宽度, 以便能适应不同字数的导航栏。2. span 设置背景右侧, padding撑开合适宽度 剩下由文字继续撑开宽度。原创 2024-07-17 16:40:33 · 132 阅读 · 0 评论 -
vertical-align 垂直对齐
vertical-align 不影响块级元素中的内容对齐,它只针对于 行内元素或者行内块元素,特别是行内块元素, **通常用来控制图片/表单与文字的对齐**。vertical-align 垂直对齐, 这个看上去很美好的一个属性, 实际有着不可捉摸的脾气,否则我们也不会这么晚来讲解。但是我们从来没有讲过有垂直居中的属性, 我们的妈妈一直很担心我们的垂直居中怎么做。以前我们讲过让带有宽度的块级元素居中对齐,是margin: 0 auto;以前我们还讲过让文字居中对齐,是 text-align: center;原创 2024-07-17 16:36:57 · 216 阅读 · 0 评论 -
web额外补充
我是小白</li><li style="cursor:pointer">我是小手</li><li style="cursor:move">我是移动</li><li style="cursor:text">我是文本原创 2024-07-17 16:35:10 · 261 阅读 · 0 评论 -
CSS3新属性初步认识
:nth-of-type` 和 `:nth-child` 选择器,两者都是选择作为第几个子元素某标签,但是又有区别。.father>div{ /*只选择到 .father 标签的第一级子级div标签, 子级的子级不会被选中*/-- 这一个就是变粉色的盒子 -->`:nth-of-type` 选中的是同类型的第几个,前提在于同类型。`:nth-child` 选中的是同级中的第几个,前提在于同级。过渡属性 `transition` 是实现css动效的属性。值为数值,值与值之间以空格隔开,无单位。原创 2024-07-17 16:31:19 · 376 阅读 · 0 评论 -
html5新标签
侧边栏文章段落1</p><p>文章段落2</p><p>文章段落3头部导航原创 2024-07-17 16:24:01 · 164 阅读 · 0 评论 -
web-css伪元素
::before和::after前面的双冒号,也可以写为单冒号。- content是必备属性,里面可以填写简单的文字内容。- 伪元素产生时,默认是行内元素,无法指定宽高。- JavaScript无法操作伪元素。原创 2024-07-17 16:16:09 · 108 阅读 · 0 评论 -
HTML-css清除浮动
浮动造成的影响原创 2024-07-17 15:45:56 · 232 阅读 · 0 评论 -
HTML表单标签
<input type="text" name="txt" id="txt" value="" placeholder="请输入文字">原创 2024-07-16 15:33:37 · 909 阅读 · 0 评论 -
表格 table(会使用)
</td>即可。在上面的语法中包含三对HTML标签,分别为 <table></table>、<tr></tr>、<td></td>,他们是创建表格的基本标签,缺一不可,下面对他们进行具体地解释。03.td /td:用于定义表格中的单元格,必须嵌套在<tr></tr>标签中,一对 <tr> </tr>中包含几对<td></td>,就表示该行中有多少列(或多少个单元格)。01. <tr></tr>中只能嵌套<td>原创 2024-07-16 15:29:19 · 371 阅读 · 0 评论 -
HTML定位居中
利用定位进行居中:div{top: 50%;原创 2024-07-16 15:24:31 · 166 阅读 · 0 评论 -
叠放次序(z-index)
在CSS中,要想调整重叠定位元素的堆叠顺序,可以对定位元素应用z-index层叠等级属性,其取值可为正整数、负整数和0。1. z-index的默认属性值是0(IE为0,FF为auto),当对多个元素同时设置定位时,定位元素之间有可能会发生重叠。,其余标准流,浮动,静态定位都无此属性,亦不可指定此属性。只有相对定位,绝对定位,固定定位有此属性。取值越大,定位元素在层叠元素中越居上。原创 2024-07-16 15:21:30 · 120 阅读 · 0 评论 -
固定定位fixed
当对元素设置固定定位后,它将脱离标准文档流的控制,始终依据浏览器窗口来定义自己的显示位置。不管浏览器滚动条如何滚动也不管浏览器窗口的大小如何变化,该元素都会始终显示在浏览器窗口的固定位置。固定定位是绝对定位的一种特殊形式,它以浏览器窗口作为参照物来定义网页元素。当position属性的取值为fixed时,即可将元素的定位模式设置为固定定位。2. 固定定位完全脱标,不占有位置,不随着滚动条滚动。1. 固定定位的元素跟父亲没有任何关系,只认浏览器。原创 2024-07-16 15:17:26 · 238 阅读 · 0 评论 -
定位(position)
定位是我们CSS算是数一数二难点的了,但是,你务必要学好它,我们CSS离不开定位,特别是后面的js特效,天天和定位打交道。就是说, 子级是绝对定位,父亲只要是定位即可(不管父亲是绝对定位还是相对定位,甚至是固定定位都可以),就是说, 子绝父绝,子绝父相都是正确的。相对定位是将元素相对于它在标准流中的位置进行定位,当position属性的取值为relative时,可以将元素定位于相对位置。首先, 我们说下, 绝对定位是将元素依据最近的已经定位绝对、固定或相对定位)的父元素(祖先)进行定位。原创 2024-07-16 15:12:43 · 290 阅读 · 0 评论 -
圆角属性border-radius: 50%;与不透明度opacity和rgba(opacity:0.5---半透明)
*圆角效果 推荐大家给50%*/ 可以给盒子宽度的一半,如果盒子宽度变了还要来改值,比较麻烦,推荐给50%代表盒子一半。2. opacity能够让背景和内容同时透明,rgba只能给元素自身(color)或者背景(background)透明。1. opacity是元素的属性,而rgba是颜色的属性值。,取值范围0-1 (最小值是0,最大值是1。opacity和rgba都有不透明的效果。原创 2024-07-16 12:51:03 · 167 阅读 · 0 评论 -
浮动(float)【float:left;左浮动(左浮动)】
用来专门让网页中**同级下**不能并排的盒子**实现并排效果**。**同级下哪些盒子要并排,就给它们都加上浮动**。浮动不要乱用,一般在同级盒子中实现并排,float:left;没有浮动居中的写法。原创 2024-07-16 12:44:54 · 134 阅读 · 0 评论 -
网页布局的三大流派
就是网页中元素默认的排列方式,自上而下,从左到右,我们前面所学习的就是标准流布局。标准流(文档流)、浮动流,定位流。在后面的学习中会讲到。原创 2024-07-16 12:41:00 · 197 阅读 · 0 评论 -
字居中用text-align:center;盒子居中用margin: 0 auto;
文字居中用text-align:center;盒子居中用margin: 0 auto;一、文字居中和盒子居中。原创 2024-07-16 12:39:44 · 106 阅读 · 0 评论 -
外边距合并(外边距塌陷)
第一种情况:如果是并列的两个盒子,那么他会以最大的那个外边距来计算。正常----所有浏览器都是以最大那个来算。第二种写法:overflow:hidden;----很强大 推荐大家用这一种。我们只是给了小盒子一个外边距,它既然把父盒子给带走了,会出现错位的bug。使用margin定义块元素的垂直外边距时,可能会出现外边距的合并。第二种:嵌套的两个盒子就真的出现bug。早期写法给父盒子加一个白色的边框,外边距合并(外边距塌陷)原创 2024-07-16 12:38:16 · 77 阅读 · 0 评论 -
溢出隐藏1、overflow:hidden;溢出隐藏--把多余的部分给掉。2、overflow:auto; 把多余的部分以滚动条的方式来显示。
把多余的部分以滚动条的方式来显示。溢出隐藏--把多余的部分给掉。原创 2024-07-16 12:36:21 · 127 阅读 · 0 评论 -
HTML注释快捷方法
- 注释语句 -->原创 2024-07-16 12:34:53 · 159 阅读 · 0 评论 -
a标签的href属性设置为无效链接的写法(javascript)
项目中在开发阶段,通常会把a标签的href属性设置为无效链接,格式可以有以下几种:">无效链接">无效链接无效链接原创 2024-07-16 12:26:42 · 177 阅读 · 0 评论 -
HTML基础重点
逗号原创 2024-07-15 16:04:37 · 763 阅读 · 0 评论 -
web今日学习目标
[ ] 能够说出标签的3种显示模式和他们的特点 块级 行内 行内块 display:block/ inline/ inline-block。- [ ] 能够说出CSS有哪些复合选择器 后代选择器 .box p 并集选择器 .box1,.box2,.box3{ ... }- [ ] 能够说出并集选择器的用法 .box1,.box2,p,h1{ xx:xx;- [ ] 能够说出后代选择器的用法 .box p span{}原创 2024-07-15 15:57:28 · 175 阅读 · 0 评论 -
【高德地图API】前端框架体系架构view篇,Web地图开发系列(一)
如果您希望和 JS API 的主体同步加载某些插件,而不是异步加载,可以在 JS API 的入口地址中添加plugin参数,将需要使用的一个或者多个插件的名称作为参数即可,这种用法在 JS API 加载完毕之后便可直接使用插件功能了。线,面的添加方式同上。官方文档矢量图形:https://lbs.amap.com/api/jsapi-v2/guide/overlays/vector-overlay。fillOpacity: 0.9, //圆形填充透明度,取值范围[0,1],0表示完全透明,1表示不透明。原创 2024-07-15 15:48:01 · 805 阅读 · 0 评论 -
【快速上手】Vue如何通过百度地图插件——vue-baidu-map插件实现地图轨迹与路线等功能
以上都是用到vue-baidu-map的文档里面的组件,大部分都是集中在这几个组件集里面,里面的属性都写的很详细,容易上手与优化。PC端,有切换地图类型、定位、缩放、标签、路线、轨迹等效果的百度地图嵌入。基础地图功能+路线+运动轨迹的过程介绍一下对应A组件使用与注意事项。ak: '这个地方填你的ak密钥'就是在百度地图自己去注册申请一个ak密钥。第三步:在main.js里面全局注册。//这个地方是官方提供的ak密钥。以下是我的箭头折线更改组件代码。第一步:先下载百度插件。原创 2024-07-15 15:31:14 · 932 阅读 · 0 评论 -
Chrome调试工具
5.如果点击元素,发现右侧没有样式引入,极有可能是类名或者样式引入错误。3.右边 CSS 样式可以改动数值(左右箭头或者直接输入)和查看颜色。6.如果有样式,但是样式前面有黄色叹号提示,则是样式属性书写错误。2.左边是 HTML 元素结构,右边是 CSS 样式。1.Ctrl+滚轮 可以放大开发者工具代码大小。4.Ctrl + 0 复原浏览器大小。原创 2024-07-15 14:00:51 · 311 阅读 · 0 评论 -
CSS字体相关属性
使用 font 属性时,必须按上面语法格式中的顺序书写,不能更换顺序,并且各个属性间以空格隔开 不需要设置的属性可以省略(取默认值),但**必须保留 font-size 和 font-family 属性**,否则 font 属性将不起作用。实际开发都是外部样式表. 适合于样式比较多的情况. 核心是:样式单独写到CSS 文件中,之后把CSS文件引入到 HTML 页面中使用.3.由于书写繁琐,并且没有体现出结构与样式相分离的思想,所以不推荐大量使用,只有对当前元素添加简单样式的时候,可以考虑使用。原创 2024-07-15 13:59:56 · 456 阅读 · 0 评论