![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端学习
文章平均质量分 89
青黄皂白
这个作者很懒,什么都没留下…
展开
-
JavaScript事件(一)
JavaScript事件(一)一、事件流1、事件冒泡IE事件流被称为事件冒泡,这是因为事件被定义为从最具体的元素(文档树中最深的节点)开始触发,然后向上传播至没有那么具体的元素(文档)。2、事件捕获事件捕获是从最不具体的节点应该最先收到事件,而最具体的节点最后收到事件。事件捕获实际上是为了在事件达到目标前拦截事件。3. DOM事件流DOM2 Events 规定事件流分为三个阶段:事件捕获、到达目标和事件冒泡。事件捕获最先发生,为提前拦截事件提供了可能。然后,实际的目标接收到事件。最后一个阶段是原创 2022-03-12 23:42:56 · 1199 阅读 · 1 评论 -
WebAPI
属性的操作getAttribute():获取一个img的src,或a链接的hrefnode.getAttribute('id')creatAttribute():用于创建(或获取)属性名attribute = document.createAttribute(name)//参数name,是属性的名称setAttribute():用于设置属性和值var node = document.getElementById("div1");node.setAttribute("my_att原创 2021-06-25 23:57:36 · 134 阅读 · 0 评论 -
Sass和Less
PART4_1Sass和Less Sass和Less都属于CSS预处理器,CSS 预处理器定义了一种新的语言,其基本思想是,用一种专门的编程语言,为 CSS 增加了一些编程的特性,如:变量、语句、函数、继承等概念。将 CSS 作为目标生成文件,然后开发者就只要使用这种语言进行CSS的编码工作。官网地址:http://lesscss.org/VSCode插件:Easy LESS官网地址:https://sass-lang.com/VSCode插件:Easy Sass添加插件后只需要在新建文件.原创 2021-04-19 10:30:19 · 424 阅读 · 0 评论 -
Bootstrap
PART3_2响应式布局 利用媒体查询,即media queries,可以针对不同的媒体类型定义不同的样式,从而实现响应式布局 。 媒体类型取值含义all用于所有设备。print用于打印机和打印预览。screen用于电脑屏幕,平板电脑,智能手机等。speech应用于屏幕阅读器等发声设备。常见选项: 媒体类型 and,not min-width、max-width orientation:portrait、orientation:原创 2021-04-19 10:29:36 · 247 阅读 · 0 评论 -
CSS布局:Flex、Grid、移动端适配方案
1.Flex弹性盒模型 随着移动互联网的发展,对于网页布局来说要求越来越高,而传统的布局方案对于实现特殊布局非常不方便,比如垂直居中。 2009年,W3C 提出了一种新的方案----Flex 布局,可以简便、完整、响应式地实现各种页面布局。目前,它已经得到了所有浏览器的支持,这意味着,现在就能很安全地使用这项功能。作用在flex容器上作用在flex子项上flex-directionorderflex-wrapflex-growflex-flowflex-s原创 2021-04-19 10:22:56 · 1390 阅读 · 1 评论 -
CSS:shadow,mask,column...
1.text-shadow文字的阴影x y blur color以上分别是x轴偏移量,y轴偏移量,模糊度,阴影颜色注:阴影的默认颜色是跟文字样色相同注:通过逗号的方式进行分割,可以设置多阴影2.box-shadow盒子阴影 x y blur spread color inset 多阴影x和y是偏移量,blur是模糊度,spread是阴影范围,color是颜色,inset是设置内阴影,多阴影用逗号隔开。 注:盒子阴影的默认样色是黑色。 注:默认就是外阴影,如果设置outse原创 2021-04-19 10:21:41 · 179 阅读 · 0 评论 -
CSS:transition、animation
1.浏览器前缀CSS3去兼容不同的浏览器,针对旧的浏览器做兼容,新浏览器基本不需要添加前缀。浏览器内核前缀IETrident-ms-FirefoxGecko-moz-OperaPresto-o-ChromeWebkit-webkit-SafariWebkit-webkit-Opera,ChromeBlink2. transition 过渡 transition-property : 规定设置过渡效果的CSS属性的名原创 2021-04-19 10:20:01 · 120 阅读 · 0 评论 -
HTML5
1.HTML 与 XHTML区别 DOCTYPE文档及编码 元素大小写 属性布尔值 属性引号 图片的alt属性 单标签写法 双标签闭合2.strong与b、em与i表现形态都是 文本加粗 和 文本斜体区别:是否具备语义化使用不同形式的标签可以减少class的使用3.引用标签blockquote : 引用大段的段落解释q : 引用小段的短语解释abbr : 缩写或首字母缩略词addre原创 2021-04-19 10:19:24 · 124 阅读 · 0 评论 -
CSS定位、float
photoShop使用?组成:菜单项工具栏辅助面板下载:https://pan.baidu.com/s/1LVa5R_btSjczLBwskCZidQ 提取码: sc3v快捷键:ctrl + r : 显示隐藏标尺在标尺上可以拖拽参考线可以通过移动工具拖拽回去,也可以在视图菜单中选择清除所有的参考线图层中的小眼睛可以对当前图层进行显示隐藏alt + 滚轮:可以对图片进行放大缩小png等图片的切图流程:1. 通过矩形选框工具,选择指定的区域微调:alt 减少区域 shift 增加原创 2021-04-19 10:17:47 · 88 阅读 · 0 评论 -
CSS样式,盒模型
CSSCSS基本语法选择器 { 属性1 : 值1 ; 属性2 : 值2 }width : 宽height : 高background-color : 背景色长度单位 : 1. px -> 像素 2. % -> 百分比 外容器1 -> 600px 当前容器 50% -> 300px 外容器2 -> 400px 当前容器 50% -> 200pxCSS样式的引入方式内联样式style属性原创 2021-04-19 10:16:49 · 111 阅读 · 0 评论 -
HTML标签
VSCode编辑器快捷键:shift + end : 从头选中一行shift + home : 从尾部选中一行shift + alt + ↓ : 快速复制一行alt + ↑或↓ : 快速移动一行多光标 : alt + 鼠标左键ctrl + d : 选则相同元素的下一个五大浏览器:IE浏览内核 (微软旗下的浏览器): Trident内核Opera浏览器内核 (Opera Software ASA旗下):最初是自己的Presto内核,后来是Webkit,现在是Blink内核;Safari浏原创 2021-04-19 10:15:19 · 193 阅读 · 0 评论 -
CSS3中伪类与伪元素的区别
面试题:CSS3中伪类与伪元素的区别 在CSS2.1中对伪类和伪元素的区别比较模糊。CSS3中对着两个概念做了相对较清晰的解释,并且在语法上野做了很明显的区分。 CSS3中规定伪类由一个冒号开始,然后为伪类的名称;伪元素由两个冒号开始,然后为伪元素的名称。 伪类本质上是为了弥补常规CSS选择器的不足,以便获取到更多信息。通常表示获取不存在与DOM树中的信息,或获取不能被常规CSS选择器获取的信息。 伪元素本质上是创建了一个有内容的虚拟容器。这个容器不包含任何DOM元素,但是可以包含内原创 2020-11-19 20:53:19 · 388 阅读 · 0 评论 -
HTML10月16日学习笔记
如何下载网页上另存为的图片 :F12->Elements->左上角选着按钮(选择图片)->查看右边->找到图片下载地址->右键(Open in new tab)关于超链接<a href="xxxx" target="_blank">点我</a>target表示目标,blank表示空白,这里表示在空白窗口打开新页面。关于无序列表type="disc" //表示实心圆type="circle" //表示空心圆type="square" //原创 2020-10-16 13:37:22 · 87 阅读 · 0 评论