合集-CSS

CSS基础-初识CSS
摘要：### 简介 CSS (cascading style shett) , 层叠样式表，是用来给HTML标签添加样式的语言。简单来说就是使网页变得更好看。 CSS的出现，使得样式和结构分离，HTML负责结构，CSS负责样式渲染。 ### CSS 书写位置 **内嵌式** 内嵌在html网页中， 和ht 阅读全文

posted @ 2023-07-08 20:11 指尖，写不尽 阅读(75) 评论(0) 推荐(0)

CSS基础-选择器
摘要：### 概念 前文说，CSS是给HTML添加样式的， 那么要想两者之间产生作用，就需要用到选择器。 选择器标记在HTML标签上; 通过选择器，浏览器可以知道什么时候加载这些样式。 CSS 通过选择器组合一组样式，集体作用在某一段html代码上。 ### 多种选择器 **标签选择器** 标签选择器，使 阅读全文

posted @ 2023-08-09 14:04 指尖，写不尽 阅读(142) 评论(0) 推荐(1)

CSS基础-权重计算
摘要：### 权重计算 CSS 的一个重要特性就是**层叠性**，即多个css块可以同时作用在一个标签上，效果可以叠加。 如果作用在同一个标签上的css语句块中有相同的语句内容， 那么他们之间谁会生效呢？ 因此，必须要有一个机制去从中间协调， 这种机制就是权重计算。 CSS规定几种简单的选择器之间的权重如 阅读全文

posted @ 2023-08-11 17:30 指尖，写不尽 阅读(91) 评论(0) 推荐(0)

CSS基础-文字样式
摘要：# 文字样式 文字是网页展示的重要内容之一，所以对文字的修饰也是CSS重点关注的一部分， CSS提供了以下常用的样式属性来修饰文字。 ### color 属性 color 用来设置文字颜色。 设置方式支持以下几种格式 - 英语颜色单词形式，如: red（红）、black（黑）、orange（橙色）等 阅读全文

posted @ 2023-08-14 08:54 指尖，写不尽 阅读(135) 评论(0) 推荐(0)

CSS基础-行和段落常用属性
摘要：介绍三个和行相关的属性。 ### line-height 定义行高，即行的高度，数值单位用px、字号倍数、百分比表示。 ```html ``` **垂直居中** 有一种垂直居中的方式就是用行高等于盒子高。 ```jsx 这是标题 文字 ``` ### text-align 文本的水平对齐方式 | 值 阅读全文

posted @ 2023-08-15 13:52 指尖，写不尽 阅读(112) 评论(0) 推荐(0)

CSS基础-继承性
摘要：# CSS的继承性 ### CSS的继承性 文本相关的属性一般具有**继承性**，即给祖先设置的样式，同样被后代标签所继承。 通常具有继承性样式 - color 文本颜色。 - font-weight、font-family、font-size 等以font开头的通常和文本相关的属性。 - text 阅读全文

posted @ 2023-08-16 10:43 指尖，写不尽 阅读(113) 评论(0) 推荐(0)

CSS基础-盒模型
摘要：## 盒模型 所有的HTML标签都可以看成矩形盒子,由width，height，padding，border构成，称为**盒模型**。 盒子的总宽度 = width + 左右padding + 左右border 盒子的总高度 = height + 上下pading + 上下border ![](ht 阅读全文

posted @ 2023-08-17 22:58 指尖，写不尽 阅读(177) 评论(0) 推荐(0)

CSS基础-浮动
摘要：### 浮动 浮动是为了元素标签的并排显示问题。 我们在浏览网页的时候，经常会看到 几个 div 块是可以并排显示的， 浮动就是解决这样问题的方法之一。 **float属性有以下的值** - float: left; 左浮动 - float: right 右浮动 **浮动的特点** - 浮动主要针对 阅读全文

posted @ 2023-08-18 10:45 指尖，写不尽 阅读(61) 评论(0) 推荐(0)

CSS基础-定位
摘要：CSS中通常使用position 属性，决定元素的定位方式。 常用的定位方式通常有 | 值 | 意义 | | | | | relative | 相对定位 | | absolute | 绝对定位 | | fixed | 固定定位 | ## 相对定位 position 设置为 relative。 相对定 阅读全文

posted @ 2023-08-21 17:16 指尖，写不尽 阅读(80) 评论(0) 推荐(0)

CSS基础-边框和圆角
摘要：# 边框和圆角 ## 边框 CSS中用border 定义边框属性。 border语法：border:[宽度][样式][颜色] 其中： - 宽度：边框的宽度，单位可以使px、em、rem 等单位，也可以使用thin、medium、thick 三种预设值 - 样式：边框的样式，值可以是 solid(实线 阅读全文

posted @ 2023-08-22 14:31 指尖，写不尽 阅读(434) 评论(0) 推荐(0)

CSS基础-背景
摘要：### **background-color** 背景颜色， 可以使用十六进制、rgb、rgba表示。 **语法** ``` /**selector 背景元素的原则去*/ /** color 背景颜色的值， 可以是 颜色名称、十六进制值、RGB、RGBA*/ selector { backgroun 阅读全文

posted @ 2023-08-24 14:59 指尖，写不尽 阅读(139) 评论(0) 推荐(0)

CSS基础-2D变形
摘要：变形是CSS3中比较颠覆性的特征之一，今天介绍四种2D变形旋转、缩放、倾斜、位移变形。 变形在CSS3用 **transform** 属性 来实现。 ### **transform-origin 属性** transform-origin 表示旋转的原点，默认是在盒子的中心位置(center)。 ! 阅读全文

posted @ 2023-08-28 11:08 指尖，写不尽 阅读(356) 评论(0) 推荐(0)

CSS基础-3D变形
摘要：![Untitled.png](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/d535a273e66643a497b6a4ace1045e32~tplv-k3u1fbpfcp-jj-mark:0:0:0:0:q75.image#?w=958&h= 阅读全文

posted @ 2023-08-30 09:31 指尖，写不尽 阅读(231) 评论(0) 推荐(0)

CSS基础-过渡动画
摘要：CSS3新添加了过渡动画， 即使用者定义好 一个元素的**开始状态**和**结束状态**， CSS会根据变化曲线形成**补间动画**效果。 CSS3中用**transition**属性来描述动画如何运动。 ![Untitled.png](https://p6-juejin.byteimg.com/t 阅读全文

posted @ 2023-08-31 10:23 指尖，写不尽 阅读(276) 评论(0) 推荐(0)

JS基础-变量
摘要：变量是计算机世界当中参与运算并存储结果的单元。 变量本身代表一个数值，是数值的抽象。 ``` // a 就表示一个变量 var a = 123; ``` ## 变量命名规则 - 变量只能用字母、数字、下划线、$组成 - 变量不能以数字开头 - 变量不能是关键字（如 var, let, const 等 阅读全文

posted @ 2023-09-04 11:12 指尖，写不尽 阅读(89) 评论(0) 推荐(0)

JS基础-数据类型
摘要：JS 作为弱类型的编程语言， 在声明变量时，统一使用 **var**、**const**、或者**let**关键字。但是每个变量都有一个隐式的数据类型。 ## 数据类型检测 使用 typeof 关键字可以检测数据类型。 ``` ``` ### Number 数字类型 - 整形、浮点型在内的所有数字， 阅读全文

posted @ 2023-09-06 09:18 指尖，写不尽 阅读(88) 评论(0) 推荐(0)

JS基础-表达式和运算符
摘要：**表达式**：是由操作数和运算符（可选）构成的并产生运算结果的语法结构。例如：3+5 **运算符**：进行计算或者逻辑运算的符号，比如表达式中的 + 号 表达式分类：算术、关系、逻辑、赋值、组合 ## 算术运算符 以下符号都是算数运算符，运算符的关键词就是运算 | 意义 | 运算符 | | -- 阅读全文

posted @ 2023-09-07 14:40 指尖，写不尽 阅读(139) 评论(0) 推荐(0)

JS基础-数据类型转换
摘要：JS存在不同的数据类型， 这就需要一些方法将不同的数据类型做转换。 ## 转数字类型 其他类型的值转换成数字， 这在工作中很常见。 有以下几种转换方式 - Number 函数 - parseInt 函数 - parseFloat 函数 ### Number Number 函数可以将 其他类型转成 数 阅读全文

posted @ 2023-09-08 14:05 指尖，写不尽 阅读(124) 评论(0) 推荐(0)

JS基础-分支语句
摘要：分支语句是流程控制语句当中的一种 可以简单理解为是一种控制条件， 当达到某个条件时，执行相应的代码 IF IF多条件分支 例如：当 变量 a > b 时， 则执行 语句块1 ， 如果 a 等于 b 时，则执行语句块2 ；最后，如果 a > b 时，则执行语句块3 if else 语句当中的语句块一般 阅读全文

posted @ 2023-09-09 09:43 指尖，写不尽 阅读(106) 评论(0) 推荐(0)

Js基础-循环语句
摘要：循环语句在js当中主要用于重复做一件事情。 js当中最主要的循环语句有三种，for循环，while循环和do-while循环 for for 是一种经常被用到的循环结构 例如：控制台循环打印1到10 的数字 // for 括号后跟着 三个表达式， 三个表达式用 分号(;) 隔开 // var i = 阅读全文

posted @ 2023-09-11 14:10 指尖，写不尽 阅读(267) 评论(0) 推荐(0)

Js基础-复杂数据类型之数组
摘要：定义 数组，就是一组相关的值存储在一块连续的空间内 一般的高级编程语言都有数组这种数据结构 语法 数组有三种定义方式，如下 使用中括号直接定义数组 var array = [12,13,14,15,16,17] 使用 new Array() 方法 传入数组元素 var array = new Arr 阅读全文

posted @ 2023-09-12 16:02 指尖，写不尽 阅读(131) 评论(0) 推荐(0)

Js基础-函数
摘要：函数是实现功能的载体， 它应该是一个最小功能的封装， 比如我们要计算两个数之和，再比如我们要实现计算正方形的体积等等。 函数定义和调用 函数定义 我们使用 function 关键字定义函数 // demo 为函数名， 自己命名但必须符合JS标识符命名规则 // () 小括号中可以带参数, 这种参数还 阅读全文

posted @ 2023-09-13 12:22 指尖，写不尽 阅读(106) 评论(0) 推荐(0)

Js基础-闭包
摘要：在介绍闭包之前，我们先看看是什么全局变量和局部变量 全局变量和局部变量 局部变量：定义在函数内部的变量（只能在内部被访问） 形参也是一种局部变量 全局变量：不在函数内部定义的变量， 就称为全局变量，全局变量在任何函数内都可以被访问和修改 假如我们在函数内部 定义了一个和外部相同名字的变量， 那么在函 阅读全文

posted @ 2023-09-15 10:54 指尖，写不尽 阅读(132) 评论(0) 推荐(0)

导航