李顺尧-CSDN博客

原创前端学习第九天

今天是学习前端的第九天，主要学习了网页布局中的一些技巧。一、精灵图精灵图是将网页中的一些小背景图像整合到一张大图中，这样浏览器只需要一次请求就可以了，有效的减少了服务器接收和发送请求的次数，提高页面的加载速度。使用时先确定好图片与盒子的大小，然后根据background-position：x y；来实现，移动的距离就是目标图片在精灵图中的x和y坐标。需要注意的是网页中的x和y坐标有所不同，向右为x轴正方向，向下为y轴正方向，因为一般情况下图片都是向上、向左移动，所以其坐标值一定是负的（0除外）。精灵图存

2020-10-22 22:45:28 96

原创前端学习第八天

今天是学习前端的第八天，主要学习了定位的相关内容。一、定位的组成。定位由定位模式和边偏移组成，定位模式用于指定一个元素在文档中的定位方式，边偏移则决定了该元素的最终位置。定位通过position属性来设置，其后可跟五个值：static（静态定位）、relative（相对定位）、absolute（绝对定位）、fixed（固定定位）以及sticky（粘性定位）。边偏移后可跟四个属性：top（顶部偏移量）、right（右侧偏移量）、bottom（底部偏移量）、left（左侧偏移量）。二、定位的分类。 1.静

2020-10-21 23:20:22 81

原创前端学习第六天

今天是学习前端的第六天，主要学习内容为：圆角边框、盒子阴影以及浮动。圆角边框：我们可以使用border-radius属性来设置元素的外边框圆角，其语法为：border-radius:length;参数可以为数值或是百分比的形式，该语法为复写形式，其后可跟一个值（四个圆角相同）、两个值（左上角和右下角为第一个值，右上角和左下角是第二个值）、三个值（左上角为第一个值，右上角和左下角为第二个值，右下角为第三个值）或是四个值（左上角、右上角、左下角、右下角）。也可以四个角分开写，但对顺序有要求，需先上下后左右，例

2020-10-18 23:23:00 100

原创前端学习第五天

今天是学习前端的第五天，主要学习内容为css的三大特性与盒子模型的相关内容。 css的三大特性为：层叠性、继承性和优先级。层叠性：在开发中对同一个元素多次设置同一个样式，此时一个样式就是覆盖（层叠）另外一个冲突的样式，最终使用最后一次设置的属性值。css的层叠性遵循如下原则：1.样式冲突时，哪个样式离结构近就遵循哪个样式（就近原则）；2.样式不冲突时，无论定义先后，始终有效（不冲突不层叠）。继承性：子元素会继承父元素的某些样式，如文本颜色、字体属性等。利用这一特性，我们可以在开发中简化代码，例如在bod

2020-10-17 06:28:20 157

原创前端学习第四天

今天是学习前端的第四天，主要学习了复合选择器、元素的显示模式及背景图片的相关用法。复合选择器由两个或多个基础选择器通过不同方式组合而成，可以更准确、更高效的选择目标元素。常用的复合选择器由四类，分别是后代选择器、子代选择器、并集选择器以及伪类选择器。后代选择器：可以选择父元素中所有的子元素，其元素可以使用任何基础选择器进行组合，但元素1必须是元素2的父级元素，二者之前用空格隔开，记为：元素1 元素2 {声明；}。子代选择器：用于选择某个元素最近一级的子元素，其元素可以使用任何基础选择器进行组合，元素1必须

2020-10-15 21:38:41 91

原创前端学习第三天

今天是学习前端的第三天，今天主要开始学习了CSS。 CSS叫做层叠样式表，是web构成部分中的样式，使用CSS可以对HTML进行美化。我们用HTML来定义结构，用CSS来定义样式，可以做到结构与样式相分离。 CSS由选择器和声明构成，选择器用来确定更改谁的样式，声明用来规定改成什么样式。其语法格式为：使用{}包含声明，每条声明以键值对形式出现，属性和值之间以：隔开，属性和属性之间以；隔开。记为：选择器 {属性：值；属性：值} CSS有三种引入方式，分别是行内样式表、内部样式表及外部样式表。行内样式表是在元

2020-10-14 22:02:20 291 1

原创前端学习第二天

今天是学习前端的第二天，依然是学习html标签，主要学习内容为表格、列表和表单。一、表格表格是用来显示、展示数据的，其标签构成为：<table></table>:该标签用于定义表格，表格内其它元素的标签应包含在该标签内部；<caption></caption>:该标签用于定义表格的标题，表格的标题可以写在该标签内，实际效果中表格的标题出现在表格外，而该标题仍包含于<table></table>标签内，并应写在第一行；<tr&g

2020-10-13 22:12:09 233 1

原创前端学习第一天

今天是学习前端的第一天，使用的浏览器为chrome浏览器，工具为VSCode，学习内容是HTML。HTML是超文本标记语言，是WEB的结构部分，是最重要的部分。 HTML主要由以下部分构成：1.<!DOCTYPE html>文档类型声明标签，位于文档最前面位置，在<html>标签之前，表明文档类型为html5；2.<html>根标签，<head>及<body>等标签应包含在<html>标签内；3.<head>为文档头部，&l

2020-10-11 23:43:35 143

weixin_51447669的博客