haobrother-CSDN博客

原创 JS学习篇（四）对象与继承

初学JavaScript（下称JS）的基本都知道，创建一个对象可以很容易：var obj = {};没错，上面代码就创建了一个空对象obj，接下来可以给它加多点料：var person = { name: "Tom", age: 24}console.log(person.name); //输出Tomconsole.log(person.age); /...

2019-05-07 20:54:41 272

原创 JS学习篇（三）函数与闭包

一个JS函数的定义由function关键字开头，然后加上函数名、参数列表和函数体。函数名与变量等JS标识符命名规则一致，以字母、下划线或者$开头，后面可以跟数字；参数列表是一个包含在括号中，以逗号分离的列表，例如：(a, b, c)；函数体是函数的主体内容，以大括号{}将JS语句包含起来，可通过return返回结果；最简单的函数定义如下所示（函数名自定义）：function f...

2019-05-05 21:34:19 280

原创 JS学习篇（二） JavaScript七种数据类型

要了解一门语言，首先要了解它的数据类型有哪些？他们之间有什么关系？能否互相转换等。目前，JavaScript（下称JS）中有七大数据类型，它们分别是：1. Boolean 布尔型2. Null 空3. Undefined 未定义4. Number 数字型5. String 字符串型...

2019-05-05 14:11:34 1641

原创 JS学习篇（一） JavaScript语言特性

最近在学习Web开发，除了之前学习笔记提到的HTML和CSS，Web开发三件套的第三样就是JavaScript（即JS）。说到JavaScript，大家就算没接触过应该也会熟悉，只要稍微看过Web开发相关学习网站的目录或者课程表就知道这是一门必修的语言课了。好，那么JavaScript是一门什么样的必修课，它是什么呢？为啥Web开发者是必修的！在写这篇学习笔记之前，我稍微查了一下，也把这...

2019-05-04 17:14:51 1413

原创 CSS学习篇（八）颜色

色彩理论在设计学和美术领域中是个大学问，但是在设计网站的时候，需要设计师对颜色有一定的了解才能创建出更加醒目又不失和谐的视觉效果，从而提高用户体验。在CSS中有三种方法来表示颜色，分别是颜色名、十六进制值、RGB和HSL。在分别介绍三种表示法之前，先了解下计算机中颜色的表现原理。众多的电子显示器与手机设备屏幕一致，它们里面的背景颜色、图片等都是由红（Red）、绿(Green)、蓝(Blue...

2019-05-01 19:50:28 271

原创 CSS学习篇（七）布局

在CSS中，布局的常用技术有以下几种：浮动定位 CSS表格弹性盒子（flexbox）网格布局技术会使用各种CSS属性来操作HTML元素，使其相对于正常布局流、父容器、周围元素而变动。正常布局流是指在不对页面进行任何布局控制时，浏览器默认的HTML布局方式。例如上面提到的浮动、定位之类的布局技术，就是主要利用float、position、display这几个CSS属性来操作布...

2019-03-26 16:36:31 374 1

原创 CSS学习篇（六）字体

在CSS中，可以设置字体的大小、颜色、种类等，这里重点讨论的是字体种类，除了一般字体的设置，还有将记录Web字体的设置方式。我们知道，当设置网页上字体的时候，如果显示网页的浏览器或其所在的电脑上不包含该字体的话，是无法显示出对应的字体来的，这时候可能使用浏览器默认字体来代替，那么一般会有两种措施来预防这种情况：选用网页安全字体利用字体栈来设置第一种，选用网页安全字体，就是指选用一些基...

2019-03-25 19:37:54 241

原创 CSS学习篇（五）盒子模型（框模型）

盒子模型（box model），也可以叫框模型，是网页布局的基础，每个HTML元素都被表示为一个矩形盒子，盒子包含了它的内容（content）、内边距（padding）、边框（border）和外边距（margin），每部分都可以用一个或多个CSS属性来指定其大小、颜色等，可以参考下图：1.内容盒子（content-box）由width和height来表示内容的宽度和高度，主要用来存放...

2019-03-25 16:29:04 434

原创 CSS学习篇（四）层叠与继承

层叠CSS（Cascading Style Sheets）中文译名层叠样式表，说明其中的Cascading很重要，意味着CSS规则有层叠的特性。什么是层叠？由于HTML中同一个元素可以被多种选择器所选择，如果这里的多个选择器的规则对于元素的同一个属性指定不同的属性值，那么应该取那个属性值呢？层叠说的就是多条CSS规则一层层地堆叠在一起时哪一条有优先权，所以层叠特性就是用来决定哪条CSS规...

2019-03-25 11:19:55 187

原创 CSS学习篇（三）单位

在讨论CSS单位之前，先列一下CSS的值类型：数值: 长度值，用于指定例如元素宽度、边框（border）宽度或字体大小；以及无单位整数。用于指定例如相对线宽或运行动画的次数。百分比: 可以用于指定尺寸或长度——例如取决于父容器的长度或高度，或默认的字体大小。颜色: 用于指定背景颜色，字体颜色等。坐标位置: 例如，以屏幕的左上角为坐标原点定位元素的位置。函数: 例如，用于指定背景...

2019-03-19 22:49:28 109

原创 CSS学习篇（二）选择器

CSS规则主要由选择器和属性来组成，其中选择器有多种形式的存在，主要用来按照不用方式来方便的选择网页中的目标元素，从而添加属性来修改其样式。下面介绍各种选择器：简单选择器（Simple selectors）：通过元素类型、class或id匹配一个或多个元素。元素选择器<p>What color do you like?</p><div>I li...

2019-03-18 00:30:31 197

原创 CSS学习篇（一）

CSS (Cascading Style sheets) 中文译名为层叠样式表，用来美化网页的样式和排版，例如修改文字的大小、颜色、间距等，将页面内容分割成多列或者添加背景图等等。CSS主要是由规则来组成，一个规则由一个选择器和一个或多个属性组成：h1 { color: blue; background-color: yellow; border: 1px solid bla...

2019-03-17 22:21:20 163

原创 HTML学习篇（八）表单

<form>、<label>、<input>等在HTML5中，表单的填写提交使用form标签，然后里面包含各种文字标签和输入项（文字输入框、单选按钮、多选按钮等），还有按钮等。下面是一个简单的HTML表单：<form action="/submitToServer" method="post"> <div>

2019-03-17 18:46:46 149

原创 HTML学习篇（七）表格

<table>、<tr>、<td>等在HTML5中，使用table标签来显示表格，tr标签表示表格中的一行内容，而td标签则代表每个表格单元：<table> <tr> <td>1</td> <td>2</td> <td&a

2019-03-17 18:04:13 210

原创新发现！Web开发初学者的圣地

前言在谈正题之前，我想先说下自己的学习和工作背景。大学四年间，我校的编程学习路线基本是这样的：Assembly -> C -> Java/C# -> SQL，但是出于自己对底层技术以及游戏的喜爱，在此基础上我自学了C++，记得当时为了学习C++专门抱着个大红本《C++ Primer》学了大半年，真是相当地不容易。俗话说兴趣是最好的老师，在毕业之前我算是学有所成，毕业后找到了一...

2019-03-07 11:31:28 348

原创 HTML学习篇（六）音频和视频

<video>标签在HTML5中，使用video标签来显示视频：<video src="myVideo.mp4" controls> <p>您的浏览器不支持H5视频。请点击 <a href="myVideo.mp4">视频链接</a> 。</p> </video&

2019-01-14 13:22:35 336

原创 HTML学习篇（五）图片

<img>标签img标签在HTML中表示一张图片，它使用src属性来指定图片的路径（JPEG、GIF、PNG、BMP、ICO格式在主流浏览器应该都支持），width和height属性指定图片的宽高，默认以图片自身宽高来显示：<body> <img src="HTML5.png" /></body>上图使用了原图默认大小256*...

2019-01-14 00:51:12 178

原创 HTML学习篇（四）超链接

超链接超链接是Web上十分关键的功能，通过它可以跳转到网上任意的页面和内容，除了HTML页面，还有图片、音视频以及其他在网络上存储的任意格式文件。如果浏览器不能识别的文件，会询问用户是否利用本地应用来打开或者下载它。<a>标签a标签通过设置href属性来指定需要跳转的页面：<body> <a href="https://www.baidu.com/...

2019-01-13 23:13:13 258

原创 HTML学习篇（三）标题，段落和列表

下面将分别总结HTML中标题（h1~h6）、段落（p）和列表（ul、ol）的使用。标题HTML里面表示标题的是h1、h2、h3、h4、h5、h6标签，通过编写以下代码：<body> <h1>这是标题 1</h1> <h2>这是标题 2</h2> <h3>这是标题 3</h3>

2019-01-13 22:04:29 2114

原创 HTML学习篇（二） head标签

<head>标签在HTML中，head标签内包含的元素表示网页文档的元数据，即用来描述网页但又不直接显示的数据。下面描述head标签及其常用内容。<title>标签顾名思义，title表示网页的标题，另外title对于网页在搜索引擎的搜索结果上也有体现。<!DOCTYPE html><html> <head> ...

2019-01-13 11:36:54 503

原创 HTML学习篇（一）

前言值得一提的是，今天终于要在这个博客写第一篇技术性的文章。其实我自己最近两天还在纠结要不要写，曾考虑过在学完后立马就投入项目实践中可能会比较好，但今天细想了下觉得开这个博客本就为了记录学习、工作和生活点滴。特别在刚开始的时候，不能因为事小而不为，越是简单、基础的东西更加要系统地整理明白才行，所以下面我试图梳理学习html的知识点以作日后参考，同时希望大家不吝赐教！HTML (HyperT...

2019-01-12 23:04:16 265

哈喽，各位新年快乐呀！今天是2019年的第一天，在这里祝愿大家新的一年能够身体健康、事事顺利，同时希望自己能够在新的一年里完成自己当初所定下的目标。言归正传，很高兴我并没有经过多久继续更新博客，上一次发博还是在一周前的平安夜。在这一周的闲余时间里我抓紧时间学习，在W3School中文站把HTML/HTML5和CSS/CSS3的基础耐心地过了一遍，期间也完成了一些实例和测验，由于存在以往自身在其...

2019-01-01 23:01:30 3709

原创 Hello, World

在CSDN的第一篇文章，记录属于我自己的全新开始。很多人都说，人生的选择比努力更加重要。在28岁即将来临的关口，同时面临着自己的第一次创业逐渐走向失败的现状，我打算为自己重新规划一次。像一年多前决定离职创业时所决定的那样，我依然对未来充满着希望，希望能够通过自己的选择和努力来实现自己的人生梦想——自由。没错，我打算重新做回技术，这次我的目标是Full Stack，这是个大的目标，而目前我已...

2018-12-24 17:27:23 150

豪阁的个人博客