自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(30)
  • 收藏
  • 关注

原创 啃下这份web前端大厂面试题,无谓寒冬(已拿Offer)

前言最近有小伙伴催我更一期前端大厂面试题,前几天都忙于私事,耽误了。。。但是,今天它来了↓这套前端面试题已经有小伙伴成功拿到了腾讯offer,所以大家可以放心借鉴。为了满足大家的需求,题都已经分享出来啦,喜欢的小伙伴别忘了给这篇小文章点个小小的赞哟,如果你觉得有用的话,也可以分享给其他小伙伴一起阅读!下面请看题:前端面试题集锦——HTML 篇1. 你是怎么理解 HTML 语义化Step 1:先举例说明 HTML 语义化简单来说就是用正确的标签来做正确的事。比如表示段落用 p 标签、表示标

2020-12-31 11:43:26 4448 8

原创 裸辞两个月从Android转战web前端的求职之路

前言看到这个标题大家可能会想:Android开发越来越不景气了吗?前端越来越火了吗?这是我一个朋友的亲身经历我是2016年6月份毕业,第一份工作是做Android开发。2018年1月初,我辞掉了工作,从零开始,在家自学了两个月的Web前端开发,3月份开始找Web前端的工作,3月底找到工作。Android开发并非不景气,如今,手机人手一部,肯定是需要APP开发,但是APP开发的热潮已经过去,现在缺的不是初级人员,而是中级、高级、专家。在互联网的下半场,想要通过开发出一个APP就去创业,几乎不可能

2020-12-14 15:01:03 2979 3

原创 面不面试的,你都得懂原型和原型链

前言不要为了面试而去背题,匆匆忙忙的,不仅学不进去,背完了几天后马上会忘记。你可能会说,“没办法,这不是为了能找份工作嘛!”。我想说的是,“那你没开始找工作的时候,咋不好好学习呢。”好了,上述扯的这些,意思就是让大家不要做收藏家,不要把好文收藏了,就放在收藏夹里吃灰!下面为大家简单阐述我对原型和原型链的理解,若是觉得有说的不对的地方,还望直接把页面关闭了,别在我这篇文章上继续浪费时间。(逃)四个规则我们先来了解下面引用类型的四个规则:1、引用类型,都具有对象特性,即可自由扩展属性。2、引

2021-03-04 20:32:10 210 1

原创 一个草根前端人的焦虑

缘起之前看到一篇公众号推送:Deno 冲上榜首,Vue.js 首次屈居第二,JavaScript 2020 年度“新起之秀”都有谁?Vite、ESBuild、SWC、TailWind、Snowpack、Vue3.0、Rzhi’qecoil、Deno、Lowcode…不管是前端领域、还是技术领域、还是娱乐圈、每年都有涌现出一大堆的新玩意、每年都有新的鲜肉火了。以往一年一届的技术大会,现在早早聊 一年要办十几次。朋友圈转发的各种课程海报…这是多角度、全方位攻击啊。我是不是落伍了? 我拿什么跟别人竞争

2021-02-02 20:37:20 258

原创 CSS行内块元素

CSS行内块元素(内联元素)一、典型代表inputimg二、特点:在一行上显示可以设置宽高<style type="text/css"> img{ width: 300px;/* 顶部对齐 */ vertical-align: top;} input{ width: 300px; height: 200px; background-color: blue; } </style></head><body

2021-01-13 14:26:16 2103

原创 标准文档流

标准文档流web页面和ps等设计软件有本质的区别,web 网页的制作,是个“流”,从上而下 ,像 “织毛衣”。而设计软件 ,想往哪里画东西,就去哪里画标准文档流下有以下微观现象1.空白折叠现象多个空格会被合并成一个空格显示到浏览器页面中。img标签换行写。会发现每张图片之间有间隙,如果在一行内写img标签,就解决了这个问题,但是我们不会这样去写我们的html结构。这种现象称为空白折叠现象。2.高矮不齐,底边对齐文字还有图片大小不一,都会让我们页面的元素出现高矮不齐的现象,但是在浏览器查看我们的页

2021-01-11 16:34:52 180 1

原创 如何解决CSS外边距塌陷的问题

首先我们先看出现外边距塌陷的三种情况:1.当上下相邻的两个块级元素相遇,上面的元素有下边距margin-bottom,下面的元素有上边距margin-top,则它们之间的垂直距离取两个值中的较大者。<style> .box1 { width: 150px; height: 100px; margin-bottom: 20px; background-color: rgb(201, 239, 98); } .box2 { width

2021-01-08 15:04:23 522

原创 CSS定位描述

CSS 定位机制CSS 有三种基本的定位机制:普通流、浮动和绝对定位。一、普通流  除非专门指定,否则所有框都在普通流中定位。普通流中元素框的位置由元素在(X)HTML中的位置决定。块级元素从上到下依次排列,框之间的垂直距离由框的垂直margin计算得到。行内元素在一行中水平布置。二、定位** 1、相对定位**  被看作普通流定位模型的一部分,定位元素的位置相对于它在普通流中的位置进行移动。使用相对定位的元素不管它是否进行移动,元素仍要占据它原来的位置。移动元素会导致它覆盖其他的框。<h

2021-01-07 14:50:57 161

原创 CSS的浮动属性

浮动属性浮动可以让元素一个挨着一个。创建一个自然流布局,同时可以设置自身尺寸和父元素容器的尺寸大小。一个元素浮动时,其他元素会“环绕”他。当元素浮动时,一个元素的位置取决于放置在他周围的元素,围绕在他周围的第是哪个元素?这个元素会不会换行,这一切取决于围绕在他周围的元素的DOM浮动存在的问题典型问题是一个父元素包含多个浮动子元素,页面内容设置一个宽度,子元素的浮动确定了他们的位置,但浮动的元素不改变父元素的宽度。这样会使父元素塌陷,从而使父元素的高度为“0”,从而忽略其他属性,这种现象多数时候

2021-01-06 16:40:54 179

原创 CSS盒模型的几种居中方式

css实现盒子模型居中方式<div class="parent"> <div class="child"></div></div>1.绝对定位 margin负值.parent{ width:600px; height:600px; margin:auto; position: relative; background-color: #000; }.child{ width:200px;

2021-01-05 14:06:59 867

原创 怎么用CSS清除默认样式

CSS 清除默认样式通常有以下几句就够了:*{margin:0;padding:0;}li{list-style:none;}img{vertical-align:top;border:none;}如果你想写全也可以:/* 清除内外边距 */body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */dl, dt, dd, ul, ol, li, /* list eleme

2021-01-04 09:45:53 384

原创 控制台的使用

chrome控制台使用(Using the Console)控制台提供了两个主要的方法给开发者测试网页和应用程序:通过使用控制台提供的Console API方法来诊断日志信息,比如说:console.log(),console.profile().即时响应的命令窗口可以和document以及chrome开发工具相互联调.在控制台可以直接测试表达式,并且可以使用Command Line API提供的方法,比如$()可以查找元素,或者使用profile()来打开CPU分析器.本文提供关于这两个API的概

2020-12-29 17:01:49 1672

原创 详解CSS盒模型

前言盒子模型,英文即box model。无论是div、span、还是a都是盒子。但是,图片、表单元素一律看作是文本,它们并不是盒子。这个很好理解,比如说,一张图片里并不能放东西,它自己就是自己的内容。盒子中的区域一个盒子中主要的属性就5个:width、height、padding、border、margin。如下:width和height:内容的宽度、高度(不是盒子的宽度、高度)。padding:内边距。border:边框。margin:外边距。盒子模型的示意图:代码演示:上面

2020-12-28 14:27:35 394

原创 我的web前端面试心法(已拿字节offer)

前言我的秋招经历基本情况:南方普通985普通学生,接触前端十个月左右,今年 8 月后开始正式准备秋招。说起我的秋招,一个词,就是“逆袭”。一开始,华为笔试没过,三七互娱笔试没过被捞起来后一面又挂,信心受挫。中间没有再继续投递,而是沉下心准备,身边同学陆续拿到offer,也挺纠结。在十月底,赶在秋招的尾巴,投了四五家网申还没截止的公司,没想到,面试一路过,最后成功上岸字节,结束秋招。准备面试和参加面试的过程中,总结了一些个人经验,梳理一下,希望对准备面试的人有些帮助,尤其是没有面试经历的学生。这里不

2020-12-26 11:28:23 853 4

原创 CSS常用的颜色样式

<style> .p1{color:red;}.p2{color:green;}.p3{color:blue;}.p4{color:#ff0000;}.p5{color:#f00;}.p6{color:rgb(255,0,0);}.p7{color:rgb(178,178,178);}.p8{color:rgb(0,0,0);} /* */</style></head><body><p class=

2020-12-25 15:24:01 995

原创 Css样式--文本样式详解

Css样式–文本样式详解文本样式包括所谓的文本缩进:text-indent水平对齐:text-align:center;left;right字间隔和字母间距、字符转换:text-transform等1.文本缩进:text-indent代码如下:p {text-indent: 5em;}1.实用负值:设置负值时要当心,如果对一个段落设置了负值,那么首行的某些文本可能会超出浏览器窗口的左边界。为了避免出现这种显示问题,建议针对负缩进再设置一个外边距或一些内边距。代码如下:p {text-ind

2020-12-24 14:05:05 335

原创 全栈修炼:如何从Web前端迈向全栈开发

前言为什么要向全栈发展?全栈开发是所有Web开发者的终极梦想,无论你现在是前端开发还是后端开发。并且随着大量开发者的涌入,前端和后端岗位都面临者激烈的竞争,全栈已经不是加分项,越来越成为必须项。如果可以发一份工资,没有哪个老板喜欢发两份工资。假以时日,你无疑是将成为一个很具价值的前端开发人员,而这也意味着,你可以尝试满足你走向全栈的野心。后端语言比较后端语言是前端跨向全栈最大的一个障碍,也是必须拿下的障碍。不像前端Javascript独霸天下,后端语言是百家争鸣:PHP、Python、Ruby

2020-12-23 11:16:37 8283 17

原创 CSS字体样式属性

1 color 字体颜色定义元素内文字颜色。语法:color:颜色名十六进制RGBcolor属性用于定义文本的颜色,其取值方式有如下3种:1)预定义的颜色值,如red,green,blue等。2)十六进制,如#FF0000,#FF6600,#29D794等。实际工作中,十六进制是最常用的定义颜色的方式。3)RGB代码,如红色可以表示为rgb(255,0,0)或rgb(100%,0%,0%)。需要注意的是,如果使用RGB代码的百分比颜色值,取值为0时也不能省略百分号,必须写为

2020-12-22 10:57:13 842

原创 CSS常用的选择器

对大多技术人员来说都比较熟悉 CSS 选择器,举一例子来说,假设给一个 p 标签增加一个类(class),可是执行后该 class 中的有些属性并没有起作用。通过 Firebug 查看,发现没有起作用的属性被覆盖了,这个时候突然意识到了 CSS 选择器的优先级问题。严格来讲,选择器的种类可以分为三种:标签名选择器、类选择器和ID选择器。而所谓的后代选择器和群组选择器只不过是对前三种选择器的扩展应用。而在标签内写入 style="" 的方式,应该是 CSS 的一种引入方式,而不是选择器,因为根本就没有用到选择

2020-12-21 09:14:43 610

原创 web前端入门的那些知识,你get到了吗?

前言想要学会一门功课,做好一件事,必须得用功,多学多想多练,总的来说,如果发现问题的话,得学会如果去解决问题1.初接触前端开发的话,一般自学者最好是使用Dreamweaver这个软件,因为这个软件是一款可视化网页制作软件,所见所得可以说这软件基本是入门“神器”,相对于初学者来说,前端入门就应该先要学会HTML+CSS,学会独立做一个静态页面,而且这门语言是所有语言中最最最简单的语言。下面是一些前端电子书,需要的自取2.有人说过,正确的方法胜过所谓的努力,这句话对于初学者来说是至理名言,因为

2020-12-18 17:39:24 3184 6

原创 手把手教你写CSS行内样式与内联样式

style行内样式表,写在标签内部;行内样式表里面的属性也是成对出现的,每一对属性之间用分号分隔(英文的)。学会了一些属性如:boder-radius,可以使按钮的四个角变为圆弧;text-decortation文本下划线;text-align文本的位置;line-height行高等属性;下面是行内样式表的写法:<input type="button" value="立即注册" style="background-color: brown;width: 150px;height: 50

2020-12-17 16:17:27 5179

原创 CSS篇一一简短介绍下CSS

什么是CSS?CSS是Cascading Style Sheet的缩写,层叠样式表,是一种用来表现文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式。CSS拥有对网页对象和模型样式编辑的能力。在主页制作时采用CSS技术,可以有效地对页面的布局、字体、颜色等效果实现更加精确的控制。1.CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式

2020-12-12 16:01:01 871

原创 终于找到了最详细系列之HTML字符实体

HTML 字符实体HTML 中的预留字符必须被替换为字符实体。一些在键盘上找不到的字符也可以使用字符实体来替换。浏览器还会把以下字符当作空白进行解析:空格(&#x0020;)、制表位(&#x0009;)、换行(&#x000A;)和回车(&#x000D;)还有(&#12288;)等等。所以如果想显示空白需要使用html实体来代替。HTML 实体在 HTML 中,某些字符是预留的。在 HTML 中不能使用小于号(<)和大于号(>),这是因为浏览器会误

2020-12-11 16:00:39 1035

原创 HTML标签语义化你再不看就OUT了

持续输出内容,等你来撩~什么是语义元素?语义是指对一个词或者句子含义的正确解释。很多html标签也具有语义的意义,也就是说元素本身传达了关于标签所包含内容类型的一些信息。例如,当浏览器解析到标签时,它将该标签解释为包含这一块内容的最重要的标题。h1标签的语义就是用它来标识特定网页或部分最重要的标题。为什么要语义化?**代码结构:**使页面没有css的情况下,也能够呈现出很好的内容结构有利于SEO: 爬虫依赖标签来确定关键字的权重,因此可以和搜索引擎建立良好的沟通,帮助爬虫抓取更多的有效信息**

2020-12-10 15:38:33 252

原创 前端编程之路一一HTML标签分类

HTML标签分类HTML标签有更多种,不仅限于以下标签,仅作记录。块级元素块级元素(block level element)可容纳内联元素和块状元素,宽度和高度起作用总是独占一行,表现为另起一行开始,而且其后的元素也必须另起一行显示宽度(width)、高度(height)、内边距(padding)和外边距(margin)都可控制宽度没有设置时,默认为100%可以包含某些块级元素和内联元素标签名标签作用主要属性说明address定义文档或文章的作者/拥有者的联系信息

2020-12-09 11:41:52 75

原创 前端编程之路一一表格标签table

在 HTML 中,我们使用 <table> 标签来定义表格。HTML 中的表格和 Excel 中的表格是类似的,都包括行、列、单元格、表头等元素。但是 HTML 表格在功能方面远没有 Excel 表格强大,HTML 表格不支持排序、求和、方差等数学计算,它一般用来展示数据。在学习表格之前,我们不妨先来看一段简单的 HTML 代码:1. <table border="1">2. <tr>3. <th>名称</th>4. <.

2020-12-08 14:20:47 1433

原创 前端编程之路一一form表单标签(详解)

<form>表单是可以把浏览者输入的数据传送到服务器端,这样服务器端程序就可以处理表单传过来的数据。<form method="传送方式" action="服务器文件"> </form>定义供用户输入的html表单method : 数据传送的方式(get/post); action :浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)所有表单控件(文本框、文本域、按钮、单选框、复选框等)都必须放在 <form></form&

2020-12-07 20:55:46 1965 1

转载 前端编程之路一一HTML锚点的用法

锚点的作用及用法    HTML中的a标签大家都非常熟悉,它是超链接标签,通过a标签能够跳转到href中指定的页面及指定的位置,a标签可以做到单页面跳转或多页面跳转,锚点能够跳转到当前页面中指定的位置,也能够跳转到指定的其他页面或其他页面中指定的位置。    锚点有2种使用方法,第一种方法是跳转到当前页面中指定的位置,即单页面跳转;第二种方法是跳转到其指定的其他页面。使用方法一:单页面跳转到指定位置。 //a标

2020-12-05 10:14:22 2640

原创 前端编程之路一一HTML常用列表标签

HTML 常用列表标签关注我,不迷路~常用列表标签在书写HTML文档时,遇到相同类型的内容,需要考虑用列表来实现(导航、排名、相关文章等),通常情况下使用的列表有三种,有序列表、无序列表和自定义列表。一、有序列表ol有序列表:有一定时间、先后、高低等顺序,如排名、热度,ol,order list只有一个类型的子元素li,list item搜索热点 <!-- 默认排序样式 --> <ol> <li>HTC区块链手机<

2020-12-04 17:00:51 148

原创 前端编程之路一一HTML的常用标签大全

html常用标签html文档结构1 <!DOCTYPE html> 2 <html lang="zh-CN"> #这个lang表示语言,zh-CN中文的意思,整个文档的内容以中文为主,如果以英文为主,就写成lang='en' 3 4 <head> 5 <meta charset="UTF-8"> 6 <title>css样式优先级</title> 7 </head> 8 <body&gt

2020-12-03 15:17:07 1125

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除