DAYNOTE
文章平均质量分 85
Dariuslwk
吾生而有涯,但学亦无涯。
展开
-
5分钟了解 position 属性
position 属性规定元素的定位类型1、position属性 说明这个属性定义建立元素布局所用的定位机制。任何元素都可以定位,不过绝对或固定元素会生成一个块级框,而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。2、position 属性值值描述absolute生成绝对定位的元素,相对于最近的非static属性进行定位;若无非stat...原创 2020-04-12 21:41:56 · 948 阅读 · 1 评论 -
z-index属性,你真的会用吗?
z-index 属性设定了一个定位元素及其后代元素或 flex 项目的 z-order。 当元素之间重叠的时候, z-index 较大的元素会覆盖较小的元素在上层进行显示。1、定义与用法z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。注释:元素可拥有负的 z-index 属性值。注释:Z-index 仅能在定位元素上奏效(例如 positi...原创 2020-04-02 18:45:47 · 684 阅读 · 0 评论 -
一个属性搞定指向小箭头
transform: rotate(α) 的 应用1、实现思路创建一个正方形的块元素 arrow添加 左侧边框、上侧边框,设置为1px solid red ;将 arrow 顺时针 旋转 45°根据 定位,将元素放在另一个元素之上2、代码实现<!DOCTYPE html><html lang="en"> <head> ...原创 2020-04-06 10:31:19 · 323 阅读 · 0 评论 -
深入浅出谈 iframe
HTML内联框架元素 <iframe> 表示 嵌套的 browsing context。它能够将另一个HTML页面嵌入到当前页面中。1、定义与用法iframe 元素会创建包含另外一个文档的内联框架(即行内框架)HTML 与 XHTML 之间的差异在 HTML 4.1 Strict DTD 和 XHTML 1.0 Strict DTD 中,不支持 iframe 元素提醒和注...原创 2020-04-01 19:06:22 · 593 阅读 · 0 评论 -
webstorm恢复误删除的项目
新建同名文件夹(一定注意名称要相同,差一个字母都不行)webstorm打开,右键选择Local History->Show History左侧单击选择想要恢复的记录,右侧单击选中整个项目选择Revert Selection,确定,项目就恢复了...原创 2020-03-29 18:47:47 · 469 阅读 · 0 评论 -
一超多强:浏览器的内核大战
主流浏览器内核介绍在前端的学习中,要实现多种浏览器的兼容性,所以就必须了解浏览器的底层原理,而内核就是非常重要的一环。1、浏览器内核?早期,浏览器内核也称为“渲染引擎”,用来解析HTML语法并进行渲染,W3C虽然规定了标准,但最终还是浏览器内核决定了浏览器该如何显示网页内容以及页面的格式信息,不过,除了IE以外,目前主流的浏览器内核都已经比较完美的支持W3C标准了。直到后来,浏览器内明确分...原创 2020-03-28 13:42:13 · 166 阅读 · 0 评论 -
快速 fieldset 属性详解
fieldset 元素通常用来对表单中的控制元素进行分组(也包括 label 元素)1、属性fieldset 中包含 所有全局属性disabled 如果设置了这个 bool 值属性, 它的后代表单控制元素也会继承这个属性, 它的首个可选的 legend 元素除外, 例如, 禁止编辑. 该元素和它的子元素不会接受任何浏览器事件, 比如点击或者 focus 事件, 一般来说浏览器会将这...原创 2020-03-27 12:31:58 · 3803 阅读 · 0 评论 -
5分钟带你理解内边距属性 padding
1、定义与用法padding 简写属性在一个声明中设置所有内边距属性说明:这个简写属性设置元素所有内边距的宽度,或者设置各边上内边距的宽度。行内非替换元素上设置的内边距不会影响行高计算;因此,如果一个元素既有内边距又有背景,从视觉上看可能会延伸到其他行,有可能还会与其他内容重叠。元素的背景会延伸穿过内边距。不允许指定负边距值。**注释:**不允许使用负值。2、padding 属性及其值...原创 2020-03-26 19:15:31 · 3196 阅读 · 0 评论 -
3分钟带你轻松了解贝塞尔曲线(cubic-bezier)
1、前言在了解 cubic-bezier 之前,你需要对 CSS3 中的动画效果有所认识,它是 animation-timing-function 和 transition-timing-function 中一个重要的内容。2、定义与用法ubic-bezier() 函数定义了一个贝塞尔曲线(Cubic Bezier)。贝塞尔曲线曲线由四个点 P0,P1,P2 和 P3 定义。P0 和 P3...原创 2020-03-25 10:57:58 · 1693 阅读 · 0 评论 -
英文断句:理解 word-wrap、word-break用法
1、定义与属性1.1、word-wrap允许长单词换行到下一行语法word-wrap: normal|break-word;值描述normal只在允许的断字点换行(浏览器保持默认处理)。break-word在长单词或 URL 地址内部进行换行。1.2、word-break在恰当的断字点进行换行语法word-break: normal|break...原创 2020-03-24 22:13:08 · 631 阅读 · 0 评论 -
::before和::after伪元素的用法
1、伪类和伪元素css3为了区分伪类和伪元素,伪元素采用双冒号写法。1.1、伪类:hover:link:active:target:not():focus1.2、伪元素::first-letter::first-line::before::after::selection::before和::after下特有的content,用于在css渲染中向元素逻辑上的头...原创 2020-03-23 10:06:24 · 234 阅读 · 0 评论 -
5分钟深入了解margin属性
1、定义与用法margin 简写属性在一个声明中设置所有外边距属性。该属性可以有 1 到 4 个值。**说明:**这个简写属性设置一个元素所有外边距的宽度,或者设置各边上外边距的宽度。块级元素的垂直相邻外边距会合并,而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合并。同样地,浮动元素的外边距也不会合并。允许指定负的外边距值,不过使用时要小心。**注释:**允许使用负值。2、属...原创 2020-03-21 12:07:06 · 21405 阅读 · 1 评论 -
关键帧(@keyframes)
@keyframes 规则通过在动画序列中定义关键帧(或waypoints)的样式来控制CSS动画序列中的中间步骤。这比转换更能控制动画序列的中间步骤。1、语法1.1、取值 帧列表的名称。 名称必须符合 CSS 语法中对标识符的定义。from 等效于 0%to 等效于 100% 动画序列中,触发关键帧的时间点,使用百分值来表示。1.2、语法格式@keyframes <...原创 2020-03-20 16:39:42 · 2093 阅读 · 0 评论 -
CSS3 opacity 属性
设置 div 元素的不透明级别1、属性opacity属性指定了一个元素的透明度。换言之,opacity属性指定了一个元素后面的背景的被覆盖程度。当opacity属性的值应用于某个元素上时,是把这个元素(包括它的内容)当成一个整体看待,即使这个值没有被子元素继承。因此,一个元素和它包含的子元素都会具有和元素背景相同的透明度,哪怕这个元素和它的子元素有不同的opacity属性值。2、语法op...原创 2020-03-20 11:35:03 · 17935 阅读 · 4 评论 -
CSS3 text-overflow 属性
1、定义与用法text-overflow 属性规定当文本溢出包含元素时发生的事情。text-overflow: clip|ellipsis|string;值描述clip修剪文本。ellipsis显示省略符号来代表被修剪的文本。string使用给定的字符串来代表被修剪的文本。2、案例分析<!DOCTYPE html> <...原创 2020-03-20 11:10:22 · 254 阅读 · 0 评论 -
dispaly、position、float的关系与相互作用
1、属性分析display属性:规定元素生成框的类型。较为常见的有none-缺省值(用于隐藏元素,元素会消失于视界和文档流中),block-块级元素,inline-block-行内块级元素,list-item列表样式块级元素等。position属性:规定元素的定位类型,常用于布局。static-默认值,元素出现在正常文档流中(此时不受top、left、right、bottom、z-index...原创 2020-03-11 15:23:51 · 212 阅读 · 0 评论 -
深入理解 BFC、IFC、GFC、FFC
1、定义BFC全称 是 block formatting context,也就是 块级格式化上下文,是用于 布局块级盒子 的一块 渲染区域。IFC全称 是 inline formatting context,也就是 内联格式化上下文,是用于 布局内联元素盒子 的一块 渲染区域。GFC全称 是 gridLayout formatting context,也就是 网格布局格式上下文,是用于 布...原创 2020-03-11 13:40:02 · 2326 阅读 · 0 评论 -
box-shadow 属性 详解
1、box-shadow 语法box-shadow: none ;box-shadow: inset x-offset y-offset blur-radius spread-radius color;2、box-shadow 属性值描述阴影类型:此参数可选,默认的投影方式是 外阴影;如果取其唯一值“inset”,就是将外阴影变成内阴影X-offset:是指 阴影水...原创 2020-03-11 01:31:34 · 28912 阅读 · 0 评论 -
高仿小米商城局部页面 (HTML+CSS)
1、设计思路1.1、将整个页面分为两部分手机 和 查看全部 部分 ,取名为 header手机 展示部分,取名为 main1.2、页面设计思维导图2、HTML 代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> ...原创 2020-03-11 00:27:14 · 2682 阅读 · 0 评论 -
Git 使用教程
1、Git 配置$ git config --global user.name "YourName"$ git config --global user.email "YourEmail"git config命令的 --global参数,表明这台机器上的所有Git仓库都会使用这个配置,也可以对某个仓库指定不同的用户名和邮箱地址。2、版本库2.1、初始化 Git 仓库$ git ini...原创 2020-03-10 21:30:26 · 94 阅读 · 0 评论 -
深入理解 font-size
1、广义上的 font-size用于设置 字体大小,辅以单位控制,实质上是控制 字符框 的高度。2、狭义上的 font-size2.1、字体的基线line-height : 意为 行高 ,content-area (内容区域),被 font-family 、 font-size 共同影响(元素看到的高度与实际字体设置大小不一样的原因)em box : 意为 字体框 ,仅被 fon...原创 2020-03-07 17:54:01 · 32643 阅读 · 1 评论 -
控制网页播放视频
基于 JavaScript的单击事件 实现 网页播放视频 的开关,以抖音首页为例1、创建以视频为背景的html网页<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>抖音</title> ...原创 2020-03-05 14:39:26 · 492 阅读 · 0 评论 -
百度在线人脸识别API简单实现
基于 Python2.7 ,百度人脸识别在线API的调用1、申请百度人脸识别应用首先需要在百度智能云平台登录,登陆后创建应用,创建的应用是人脸识别的,默认已帮你勾选上了相关功能。创建应用后,点击管理应用,你就可以获取 API Key 和 Secret Key 。2、获取token现在就可以编写代码调用在线的 人脸检测API 了首先是获取 token ,用于校验,代码如下,注意换成自己...原创 2020-03-05 14:36:57 · 2373 阅读 · 0 评论 -
VS code 配置 C/C++ 环境(Windows)
1、前期准备1.1、VS code从 微软官网 下载最新版的 VS code,建议在安装时将选项全部勾选上,勾选后在文件和文件夹的右键菜单中会多出 Open with Code 这个选项,也就是用 vscode打开当前文件/文件夹。1.2、mingw-w64因为vscode只是一个代码编辑器,没有自带有C/C++的编译器。因此首先需要安装一个C/C++编译器并且设置环境变量,这里使用...原创 2020-03-05 14:34:38 · 649 阅读 · 0 评论 -
spool 命令详解(Oracle数据库)
记录 数据库命令 操作,并且储存在txt文件中1、启动 spool 命令SQL> spool path;path是创建记录命令的文件的绝对路径2、clear screen 命令SQL> clear screen;clear screen 命令用于清屏,但不会清除txt文件里的记录3、关闭 spool 命令SQL> spool off;spool off 命...原创 2020-03-05 14:31:02 · 5133 阅读 · 0 评论 -
LeetCode刷题
1、 刷题方法1.1、 时间规划每天都刷、规定时间牢记思路1.2、 按类型刷题每个类型10—20题(动态规划,多多益善),总计200-300题搞懂数据类型、数据结构、算法1.3、通过标签筛选题目难度类型1.4、刷题技巧同一类型的题目要一起刷刷题第一遍:5分钟以内想不出来题目,看答案刷题第二遍:尝试不要看答案,15-20分钟内实现...原创 2020-03-05 14:28:26 · 133 阅读 · 0 评论 -
使用字体图标教程
使用字体图标教程以fontAwesome为例1、下载 fontAwesome 包从 fontAwesome官网下载压缩包2、使用 fontAwesome 包将 fontAwesome 包解压然后复制到工程目录3、使用字体图标在html文件的head 标签里输入以下代码:<link rel="stylesheet" href="font-awesome/css/font-a...原创 2020-03-05 14:23:57 · 148 阅读 · 0 评论