08 2023 档案

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

posted @ 2023-08-31 10:23 指尖，写不尽 阅读(264) 评论(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 指尖，写不尽 阅读(221) 评论(0) 推荐(0)

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

导航