当我们用ArcGIS JS API 4版本实例化完一张二维地图的时候,鼠标移入地图区域内进行点击时,在地图周围会出现一个5像素的黑色边框,虽然不影响其他功能,但是看起来不太美观,所以本文介绍下如何去除ArcGIS JS API 4.16实例化后的地图拖动时默认自带的5px的外边框,这种方法对4版本的API都是通用的。
小轻相信,许多人对网页是很感兴趣并且是很想学习的。当初创立小轻网及小轻论坛网页就是为了帮助大家学习一些技术经验,同时也学会如何去找资源。今天,我们给原有网页加一些部件,达到装饰和增加功能的作用。
css&javascript 一.CSS 1.CSS介绍 CSS 指层叠样式表 (Cascading Style Sheets),用来定义网页的显示效果。 把样式添加到HTML中,可以将网页内容与显
只想说, 本文最重要的是对 CSS, 伪元素, keyframe的分享, 以及读者对这些东西的真正掌握, 我并不是怂恿大家在每一个页面的前面都去加一个酷炫的加载
源码分析: Dropdowns.scss:下拉框模块 Javascripts/bootstrap/dropdown.js:实现下拉框响应 实现功能及原理: 下拉选项卡,默认不能实现显示选中项的功能 原理: 1、利用dropdown类作为定位点,然后让子级的列表dropdown-menu绝对定位实现,还需要加一个单击点作为设置data-toggle=”dropdown”才能做关联。 2、 需要js插件的支持 源码分析: 1、caret:实现向下的三角形,利用边框实现的 1.1、边框颜色默认是字
因为公司系统需要实现横向文字滚动效果,所以自己手动写了一个,没用网上的,感觉网上的啰嗦繁琐,扩展性还不行,喜欢的话点赞收藏吧,下面是gif效果图。
------------------------------------盒子模型常用的八个属性--------------------------------- Js盒子模型 Js盒子模型指的是通过js提供的一系列的属性和方法,获取页面中元素的样式信息值 client系列(当前元素的私有属性) clientWidth/clientHeight:内容的宽度/高度+左右/上下填充,(和内容溢出没有关系) clientLeft:左边框的宽度(borderLeftWidth) clientTop:上
一些属性和方法,在dom中没有规定如何确定页面中元素大小的情况下诞生。。。 1.偏移量(offset dimension) 测试代码: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>offset偏移量学习</title> 6 <meta name="author" content="郭菊锋/702004176@qq.com"/> 7
有时候会看到有的网页加载时上方出现进度条,一直想加到自己的博客上来,今天折腾了一番,终于成功了,记录下来。
你是否在使用 Fabric.js 时希望能在选中元素后自定义元素样式或选框(控制角和辅助线)的样式?
(背景图片可以放置于 content-box、padding-box 或 border-box 区域。)
color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; /*文字大小*/ font-style:itelic; /*文字斜体*/ font-variant:small-caps; /*小字体*/ letter-spacing : 1pt; /*字间距离*/ line-height : 200%; /*设置行高*/ font-weight:bold; /*文字粗体*/ vertical-align:sub; /*下标字*/ vertical-align:super; /*上标字*/ text-decoration:line-through; /*加删除线*/ text-decoration: overline; /*加顶线*/ text-decoration:underline; /*加下划线*/ text-decoration:none; /*删除链接下划线*/ text-transform : capitalize; /*首字大写*/ text-transform : uppercase; /*英文大写*/ text-transform : lowercase; /*英文小写*/ text-align:right; /*文字右对齐*/ text-align:left; /*文字左对齐*/ text-align:center; /*文字居中对齐*/ text-align:justify; /*文字分散对齐*/ vertical-align属性 vertical-align:top; /*垂直向上对齐*/ vertical-align:bottom; /*垂直向下对齐*/ vertical-align:middle; /*垂直居中对齐*/ vertical-align:text-top; /*文字垂直向上对齐*/ vertical-align:text-bottom; /*文字垂直向下对齐*/ 二、CSS边框空白 padding-top:10px; /*上边框留空白*/ padding-right:10px; /*右边框留空白*/ padding-bottom:10px; /*下边框留空白*/ padding-left:10px; /*左边框留空白 三、CSS符号属性 list-style-type:none; /*不编号*/ list-style-type:decimal; /*阿拉伯数字*/ list-style-type:lower-roman; /*小写罗马数字*/ list-style-type:upper-roman; /*大写罗马数字*/ list-style-type:lower-alpha; /*小写英文字母*/ list-style-type:upper-alpha; /*大写英文字母*/ list-style-type:disc; /*实心圆形符号*/ list-style-type:circle; /*空心圆形符号*/ list-style-type:square; /*实心方形符号*/ list-style-image:url(/dot.gif); /*图片式符号*/ list-style-position: outside; /*凸排*/ list-style-position:inside; /*缩进*/ 四、CSS背景样式 background-color:#F5E2EC; /*背景颜色*/ background:transparent; /*透视背景*/ background-image : url(/image/bg.gif); /*背景图片*/ background-attachment : fixed; /*浮水印固定背景*/ background-repeat : repeat; /*重复排列-网页默认*/ background-repeat : no-repeat; /*不重复排列*/ background-repeat : repeat-x; /*在x轴重复排列*/ background-repeat : repeat-y; /*在y轴重复排列*/ 指定背景位置 background-position : 90% 90%; /*背景图片x与y轴的位置*/ background-position : top; /*向上对齐*/ background-position : buttom; /*向下对齐*/ background-position : left; /*向左对齐*/ background-position : right; /*向右对齐*/ background-position : center; /*居中对齐*/ 五、CSS连接属性 a /*所有超链接*/
下面是自己学HTML+DIV+CSS+JS时的学习笔记,给大家分享以下,相互学习。大二时候寒假在家无聊的时候想做点事,总结了一下web前端基础的东西,下面的每个字都是自己手敲的。 1、<html>和</html> 标签限定了文档的开始和结束点。 属性: (1) dir: 文本的显示方向,默认是从左向右 (2) lang: 表示整个文档中所使用的语言,en--英文,zh--中文 (3) version:定义创作文档的HTML的标准版本 2、<head></head>用于
取值:数字+px 百分比 (圆角半径)
“ 转眼间已经参与过好几个小程序的开发了,下面我将开发中的那些注意点和各位小伙伴们分享下,妥妥的干货一枚。 ” WXML 1 不要换行写 微信开发者工具不会对代码进行trim操作,如果代码中换行,页面也直接换行。 2 wx:if vs hidden 一般来说,wx:if有更高的切换消耗而hidden有更高的初始渲染消耗。因此,如果需要频繁切换的情景下,用 hidden 更好,如果在运行时条件不大可能改变则 wx:if 较好。 3 图片处理 1.大图片也会造成页面切换的卡顿有一部分小程序会在页面中引用大
一个程序猿和普通电脑用户,当他们浏览到一个效果炫酷的网页的时候,他们的反应是不太相同的:
条纹表格.table-striped(作用在table的class类名),实现隔行换色
前面写了几篇 p5.js 文章 都还没涉及到3D图形,但其实 p5.js 是提供了基础的3D图形的。
HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言 最主要的不同: XHTML 元素必须被正确地嵌套。 XHTML 元素必须被关闭。 标签名必须用小写字母。 XHTML 文档必须拥有根元素。
在前端有一句古话,叫能用CSS实现的就别麻烦JS,因为声明式的配置语言CSS相比于自由式的编程语言JS,更容易被编译器所优化,比如css渲染引擎会优先考虑gpu加速,因此CSS动画的性能往往高于JS动画,本文介绍在不需要html和js的配合的情况下,用纯css实现一个好看的四角边框。
众所周知,Solo 博客系统自带看板娘,一定程度上可以吸引访客,提高人气,为我们的博客增色不少,但时间长了总觉得缺点什么,感官上给人很是单调,不够猛男。所以我们可以把看板娘装饰的更漂亮更可爱一点,以达到锦上添花的效果。
(3).如果使用window.open(“showPrint.html”,”print”); 打印预览页面的话
框选是 fabric.js 默认提供的一种操作,fabric.js 提供了几个属性可以设置选框样式。
如何给 Web 页面增加夜间模式功能?其实所谓的夜间模式就是在页面上增加一个透明的遮罩层,但是遮罩层会挡住页面元素, 解决方法是 添加 DIV,给 DIV 的 outline 属性一个很大的 outline-width 值,用 outline 的边框作为遮罩,这样既能正常点击页面元素,又能达到夜间模式的效果。
字体:实际上是长得像图标的字体,占用的空间小,消耗的带宽小,能够更快的显示页面。字体是矢量的,所以不会失真,可以按照字体一样设置字体颜色和大小。
Less 是一门 CSS 预处理语言,它扩充了 CSS 语言,增加了诸如变量、混合(mixin)、函数等功能,让 CSS 更易维护、方便制作主题、扩充。Less 可以运行在 Node 或浏览器端
(写sql也行的,js是吧数据拉出来操作,sql是在服务器端操作,建议不要勾选SQL表达式)
今天继续做案例,昨天就看了三集...想要看完真是遥遥无期,我真的太懒了...间歇性踌躇满志,持续性懒惰,达咩!!!
使用 fabric.js 在某些情况下你可能需要固定元素边框的宽度,仔细看文档你会发现 fabric.js 已经为我们提供了这个功能。本文简单介绍一下这个功能。
参考:https://www.bilibili.com/video/BV1v7411R7mp 最终效果:
问题: 遇到多行多列排列的图片时,hover上去加边框会把下面的图片挤到别处 ============================================================ 注意: IE11以下浏览器加载图片会默认给它加一个1px的边框 解决方法:对图片设置border:none ============================================================= hover加边框解决方案: 原先: </h
– 用JavaScript描述网页的事件处理,即鼠标或键盘在网页元素上的动作后的程序
这么写其实加的是内边框,就算扩大imgV的frame,也还是会有部分图片被边框遮住。
上个寒假总结的web前端的一些知识点给大家分享一下 1、<html>和</html> 标签限定了文档的开始和结束点。 属性: (1) dir: 文本的显示方向,默认是从左向右 (2) lang: 表示整个文档中所使用的语言,en--英文,zh--中文 (3) version:定义创作文档的HTML的标准版本 2、<head></head>用于封装位于文档头部的其他标签 属性: (1) dir:文本的显示方向 (2) Lang:语言信息 (3) Profile:提供了与当前文件相关联的文档数据的URL
最近被派去维护和开发一些做了一半、年久失修的项目。有一部分内容是关于word文件导出,顺带着把excel、pdf文件的导出也调研下吧,我想未来开发我应该会遇到的,遂做了下笔记分享给需要的人。
从 3 月 28 日内推投递简历开始, 经历 7 轮面试, 在 5 月 17 日收到录用意向书. 和大家分享一下面试的经历和个人的一些看法. 简历筛选一面. 面试官花名执衡, 是 ng-zorro-antd 的主力开发者之一. 因为这个部门在开发 ng-zorro-antd, 而我的 GitHub 上也有一些前端组件开发的项目, 所以基本上都是围绕这一方面问的. 讲了一下印象最深刻的一个组件的设计, Dialog, 讲了讲 API 的修改和组件之间的解耦 DatePicker 是怎么实现的 如何实现一个 c
本文没有什么高深的东西,就是写几个CSS样式经常遇见的东西,可能大部分都已经知道怎么解决了,当做小白文浏览就好。
web前端 —— 移动端知识的一些总结 个人在移动端的一些总结归纳,有新的知识点会一直更新 一.css部分 1.meta标签 <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/> 移动端加上这个标签才是真正的自适应,不加的话,假如你把一个980px宽度(手机端常规是980)的PC网页 放在手机上显示,倒也能正常显示不出现滚动条,不过是移动设备对页面 做了缩小优化,所以字体等都相应
1.什么是事件 JavaScript事件是由访问Web页面的用户引起的一系列操作, 例如:用户点击。当用户执行某些操作的时候,再去执行一系列代码。 2.事件的三种写法 //在HTML中把事件处理函数作为属性执行JS函数 <input type="button" value="按钮" onclick="alert('你好');" /> //执行与脚本分离 <input type="button" value="按钮" onclick="fn();" /> //
讲解课程:https://edu.csdn.net/course/detail/9531
哔哩哔哩注册–表单练习 HTML代码 可能代码有些不足或者用词不当等 希望大家能够见谅 这是一次bilibili的注册表单练习 里面都有详细注释 当然一个网页有许多种 这只是其中一种 是为了相互交流 希望大家喜欢 最后的效果是这样子的 📷 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sca
在 window 下有一个方法:window.getComputedStyle(element, string) 可以获取一个元素所有的属性值。
利用伪元素、关键帧动画,你将具有强大的创造力,本文就是一个例子。本例中,利用两者,就可以构建一个加载动画,无需任何JS代码和图片。
一位叫做Victor Dibia的程序猿说,“三行代码”就能实时追踪你的手,只要有个浏览器。
CSS权重指的是样式的优先级,有两条或多条样式作用于一个元素,权重高的那条样式对元素起作用,权重相同的,后写的样式会覆盖前面写的样式。
但是以上两个思路均有问题。如果设置border,如何使其边框动画?如果周边设置4个div,那么不仅是需要js操控,并且无形之中增加了许多复杂度,与编程思想背道而驰。 那么我们还有别的办法来处理使边框动起来吗?首先,动画是一定要有的。其次,如果不能用border,那么用background怎么样呢? justdoit.
本文是 CSS Houdini 之 CSS Painting API 系列第四篇。
CSS布局 确定页面的大致结构,页面分多少块,每块的位置。每个部分怎么把该部分撑起来。 * 早期以table为主(简单) * 之后 以技巧性的布局为主(难) * 现在有flexbox/grid(偏简单) * 响应式布局 在移动端大行其道的时代 是必备的 * table表格布局 * float浮动 + margin * inline-block布局 (用起来方便,但是小问题较多) * flexbox布局 盒模型 如下图所示: 宽度和高度 指的是content的宽度和高度 margin指的是 距离上一个元素
在上一篇《常用的web方法 web API(一)》中我们学习了:绑定事件的几种方式、解绑事件的几种方式、创建元素的几种方式、获取节点的几种方式本篇我们将继续学习:轮播图的js方法、offset系列相关属性、scroll系列属性、client系列以及获取元素计算后的样式属性值。好了,接下来我们接着学习:
领取专属 10元无门槛券
手把手带您无忧上云