CSS学习笔记
文章平均质量分 74
在到处之间找我
这个作者很懒,什么都没留下…
展开
-
CSS 使用动画—— @keyframes 规则和 animation 规则
目录动画@keyframes规则浏览器支持CSS3动画属性CSS3动画什么是CSS3中的动画实例动画通过 CSS3,我们能够创建动画,这可以在许多网页中取代动画图片、Flash 动画以及 JavaScript。@keyframes规则@keyframes 规则用于创建动画。在 @keyframes 中规定某项 CSS 样式,就能创建由当前样式逐渐改...原创 2018-03-06 19:13:40 · 16244 阅读 · 1 评论 -
CSS设置文本样式(二)
字体名称font-family属性规定元素的字体系列font-family 可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体,则会尝试下一个。也就是说,font-family 属性的值是用于某个元素的字体族名称或/及类族名称的一个优先表。浏览器会使用它可识别的第一个值。有两种类型的字体系列名称:指定的系列名称:具体字体的名称,比如:"times"、"courier"、"ar...原创 2018-03-06 12:58:21 · 272 阅读 · 0 评论 -
CSS设置文本样式(一)
对齐文本text-align属性规定元素中的文本的水平对齐方式。可能的值值描述left把文本排列到左边。默认值:由浏览器决定。right把文本排列到右边。center把文本排列到中间。justify实现两端对齐文本效果。inherit规定应该从父元素继承 text-align 属性的值。<html><head><style type="text/css">...原创 2018-03-06 10:56:14 · 1170 阅读 · 0 评论 -
CSS控制边框和背景
定义简单边框border属性(简写属性)元素的边框(border)是围绕元素内容和内边距的一条或多条线CSS border属性允许我们规定元素边框的样式、宽度和颜色。定义和用法border简写属性在一个声明设置所有的边框属性。可以按顺序设置如下属性:• border-width• border-style• border-color如果不设置其中的某个值,也不会出问题,比如border: soli...原创 2018-03-05 20:12:15 · 686 阅读 · 0 评论 -
CSS选择器
选择器一般只出现在文档内嵌样式表和外部样式表中,在元素内嵌样式表中基本上是不存在的。元素/类型选择器(根据类型选择元素)最常见的CSS选择器是元素选择器。换句话说,文档的元素就是最基本的选择器。在W3C标准中,元素选择器又称为类型选择器(type selector)。类型选择器匹配文档元素类型的名称。类型选择器匹配文档树中该元素类型的每一个实例。<!-- 如果设置HTML样式,选择器通常是某...原创 2018-03-05 14:58:47 · 462 阅读 · 0 评论 -
初级CSS设计
一共有三种方法创建CSS元素内嵌样式表<a style='font-size: 40px'; color='#ff0000';>元素内嵌样式表</a><!DOCTYPE HTML> <html> <body> <a>CSS简介</a> <br /> &l原创 2018-03-04 22:25:55 · 142 阅读 · 0 评论 -
CSS基础语法
CSS语法CSS规则由两个主要的部分构成:选择器,以及一条或者多条声明。selector {declaration1; declaration2; ... declarationN }选择器通常是我们需要改变样式的HTML元素。每条声明由一个属性和一个值组成。属性(property)是我们希望设置的样式属性(style attribute)。每个属性有一个值。属性和值被冒号分开。selector ...原创 2018-03-04 20:15:43 · 194 阅读 · 0 评论 -
CSS简介
CSS简介--层叠样式表(Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。--CSS是能够真正做到网页表现与内容分离的一种样式设计语言。相对于传统HTML的表现而言,CSS能够对网页中的对象的位置排版进行像素级的精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力,并...原创 2018-03-04 19:35:36 · 438 阅读 · 0 评论 -
CSS盒子/框模型
CSS盒子模型(Box Model)所有HTML元素可以看做盒子,在CSS中,"box model"这一术语是用来设计和布局时使用。CSS盒子模型(Box Model)规定了元素框处理元素内容、内边距、边框和外边框的方式。概述CSS盒子模型本质上是一个盒子,封装周围的HTML元素,它包括:边距(margin)、边框(border)、填充(padding)和实际内容(content)。盒子模型允许我...原创 2018-03-06 21:44:56 · 271 阅读 · 0 评论 -
CSS 3D转换——transform 属性的 rotatex() 方法和 rotatey() 方法
目录CSS 3D转换浏览器支持转换属性3D Transform方法常用方法rotatex() 方法rotatey() 方法结语CSS 3D转换CSS3 允许我们使用 3D 转换来对元素进行格式化。浏览器支持表格中的数字表示支持该属性的第一个浏览器版本号。紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏...原创 2018-03-06 21:11:54 · 22898 阅读 · 0 评论 -
CSS 2D转换——transform属性
2D转换通过CSS3转换,我们能够对元素进行移动、缩放、转动、拉长或拉伸。浏览器支持表格中的数字表示支持该属性的第一个浏览器版本号。紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏览器版本号。属性ChromeIEFirefoxSafariOperatransform36.04.0 -webkit-10.09.0 -ms-16.03.5 -moz-3.2 -w...原创 2018-03-06 20:58:40 · 1578 阅读 · 0 评论 -
CSS使用过渡——transition属性
过渡通过CSS3,我们可以在不使用Flash动画或者JavaScript的情况下,当元素从一种样式转换为另一种样式时为元素添加效果。浏览器支持表格中的数字表示支持该属性的第一个浏览器版本号紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏览器版本号。属性ChromeIEFirefoxSafariOperatransition26.04.0 -webkit-10...原创 2018-03-06 18:14:07 · 3703 阅读 · 0 评论