【 CSS 】
关注
分享
扫一扫
CSS 文档
HarkerYX
学习各类技术CSDN博客专家！
热爱日系指弹！
目前就职新能源汽车行业！
展开
-
《CSS 教程》
《CSS 简介》《CSS 语法》《CSS Id 和 Class》《CSS 创建》《CSS Backgrouds背景》《CSS Text文本》《CSS Fonts字体》《CSS Web安全字体组合》《CSS 链接link》《CSS 列表样式》《CSS Table表格》《CSS 盒子模型》《CSS Border边框》《CSS outline轮廓》...原创 2019-06-26 09:20:15 · 525 阅读 · 0 评论 -
《CSS 文本》
CSS文本格式文本格式This text is styled with some of the text formatting properties. The heading uses the text-align, text-transform, and color properties. The paragraph is indented, aligned, and the s...转载 2019-06-25 13:09:48 · 281 阅读 · 0 评论 -
《CSS 字体》
CSS字体CSS字体属性定义字体，加粗，大小，文字样式。serif和sans-serif字体之间的区别在计算机屏幕上，sans-serif字体被认为是比serif字体容易阅读CSS字型在CSS中，有两种类型的字体系列名称：通用字体系列- 拥有相似外观的字体系统组合（如 "Serif" 或 "Monospace"） 特定字体系列- 一个特定的字体系列（如 "Ti...转载 2019-06-25 13:10:26 · 593 阅读 · 0 评论 -
《CSS Web安全字体组合》
CSSWeb安全字体组合常用的字体组合font-family属性是多种字体的名称，作为一个"应变"制度，以确保浏览器/操作系统之间的最大兼容性。如果浏览器不支持的第一个字体，它尝试下一个的字体。你想要的字体类型如果浏览器找不到，它会从通用的字体类型中找到与你相似的:<!DOCTYPE html><html><head><meta ...转载 2019-06-25 13:10:36 · 483 阅读 · 0 评论 -
《CSS 伪元素》
CSS伪元素CSS伪元素是用来添加一些选择器的特殊效果。语法伪元素的语法：selector:pseudo-element {property:value;}CSS类也可以使用伪元素：selector.class:pseudo-element {property:value;}:first-line 伪元素"first-line" 伪元素用于向文本的首行设置特...转载 2019-06-27 16:24:51 · 259 阅读 · 0 评论 -
《CSS 链接》
CSS链接不同的链接可以有不同的样式。链接样式链接的样式，可以用任何CSS属性（如颜色，字体，背景等）。特别的链接，可以有不同的样式，这取决于他们是什么状态。这四个链接状态是：a:link - 正常，未访问过的链接 a:visited - 用户已访问过的链接 a:hover - 当用户鼠标放在链接上时 a:active - 链接被点击的那一刻<!DOCTY...转载 2019-06-25 13:10:47 · 273 阅读 · 0 评论 -
《CSS 列表样式》
CSS列表CSS列表属性作用如下：设置不同的列表项标记为有序列表 设置不同的列表项标记为无序列表 设置列表项标记为图像列表在HTML中，有两种类型的列表：无序列表 - 列表项标记用特殊图形（如小黑点、小方框等） 有序列表 - 列表项的标记有数字或字母使用CSS，可以列出进一步的样式，并可用图像作列表项标记。不同的列表项标记list-style-type属性...转载 2019-06-25 13:10:59 · 317 阅读 · 0 评论 -
《CSS 表格》
CSS表格使用 CSS 可以使 HTML 表格更美观。Company Contact Country Alfreds Futterkiste Maria Anders Germany Berglunds snabbköp Christina Berglund Sweden Centro comercial Moctezuma Fran...转载 2019-06-26 09:17:24 · 449 阅读 · 0 评论 -
《CSS 盒子模型》
CSS盒子模型CSS 盒子模型(Box Model)所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。下面的图片说明了盒子模型(Box Model)：不同部分的说明：Ma...转载 2019-06-26 09:17:55 · 284 阅读 · 0 评论 -
《CSS 边框》
CSS边框CSS 边框属性CSS边框属性允许你指定一个元素边框的样式和颜色。边框样式边框样式属性指定要显示什么样的边界。border-style属性用来定义边框的样式border-style 值:none: 默认无边框<!DOCTYPE html><html><head><meta charset="utf-...转载 2019-06-26 09:19:01 · 517 阅读 · 0 评论 -
《CSS 轮廓》
CSS轮廓（outline）轮廓（outline）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。轮廓（outline）属性指定元素轮廓的样式、颜色和宽度。轮廓（outline）实例在元素周围画线<!DOCTYPE html><html><head><meta charset="utf-8"> &l...转载 2019-06-26 09:19:57 · 301 阅读 · 0 评论 -
《CSS 外边距》
CSSmargin(外边距)CSS margin(外边距)属性定义元素周围的空间。marginmargin 清除周围的（外边框）元素区域。margin 没有背景颜色，是完全透明的。margin 可以单独改变元素的上，下，左，右边距，也可以一次改变所有的属性。可能的值值 说明 auto 设置浏览器边距。 这样做的结果会依赖于浏览器 length...转载 2019-06-26 09:20:45 · 1632 阅读 · 0 评论 -
《CSS 导航栏》
CSS 导航栏垂直水平导航栏熟练使用导航栏，对于任何网站都非常重要。使用CSS你可以转换成好看的导航栏而不是枯燥的HTML菜单。导航栏=链接列表作为标准的HTML基础一个导航栏是必须的。在我们的例子中我们将建立一个标准的HTML列表导航栏。导航条基本上是一个链接列表，所以使用 <ul> 和 <li>元素非常有意义：<!...转载 2019-06-27 17:15:27 · 401 阅读 · 0 评论 -
《CSS 背景》
CSS 背景属性用于定义HTML元素的背景。CSS 属性定义背景效果:background-color background-image background-repeat background-attachment background-position背景颜色background-color 属性定义了元素的背景颜色.页面的背景颜色使用在body的选择器中:&l...转载 2019-06-25 13:09:33 · 854 阅读 · 0 评论 -
《CSS 伪类》
CSS伪类(Pseudo-classes)CSS伪类是用来添加一些选择器的特殊效果。语法伪类的语法：selector:pseudo-class {property:value;}CSS类也可以使用伪类：selector.class:pseudo-class {property:value;}anchor伪类在支持 CSS 的浏览器中，链接的不同状态都可以以不...转载 2019-06-27 15:37:05 · 521 阅读 · 0 评论 -
《CSS 组合选择符》
CSS组合选择符CSS 组合选择符 组合选择符说明了两个选择器直接的关系。 CSS组合选择符包括各种简单选择符的组合方式。在 CSS3 中包含了四种组合方式:后代选择器(以空格分隔) 子元素选择器(以大于号分隔） 相邻兄弟选择器（以加号分隔） 普通兄弟选择器（以破折号分隔）后代选择器后代选择器用于选取某元素的后代元素。以下实例选取所有 <p>...转载 2019-06-27 15:25:57 · 265 阅读 · 0 评论 -
《CSS padding填充》
CSSpadding（填充）CSS padding（填充）是一个简写属性，定义元素边框与元素内容之间的空间，即上下左右的内边距。padding（填充）当元素的 padding（填充）内边距被清除时，所释放的区域将会受到元素背景颜色的填充。单独使用 padding 属性可以改变上下左右的填充。可能的值值 说明 length 定义一个固定的填充(像素, p...转载 2019-06-26 09:48:15 · 1297 阅读 · 0 评论 -
《CSS 分组和嵌套选择器》
CSS分组和嵌套选择器分组选择器在样式表中有很多具有相同样式的元素。h1{color:green;}h2{color:green;}p{color:green;}为了尽量减少代码，你可以使用分组选择器。每个选择器用逗号分隔。在下面的例子中，我们对以上代码使用分组选择器：<!DOCTYPE html>...转载 2019-06-26 09:54:15 · 334 阅读 · 0 评论 -
《CSS 尺寸(Dimension)》
CSS尺寸 (Dimension)CSS 尺寸 (Dimension) 属性允许你控制元素的高度和宽度。同样，它允许你增加行间距。设置不同元素的高度<!DOCTYPE html><html><head><meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title&...转载 2019-06-26 10:05:03 · 318 阅读 · 0 评论 -
《CSS Display显示》
CSSDisplay(显示)与Visibility（可见性）display属性设置一个元素应如何显示，visibility属性指定一个元素应可见还是隐藏。Box 1Box 2Box 3隐藏元素 - display:none或visibility:hidden隐藏一个元素可以通过把display属性设置为"none"，或把visibility属性设置为"hidden"。...转载 2019-06-26 10:26:32 · 256 阅读 · 0 评论 -
《CSS 简介》
CSS简介你需要具备的知识在继续学习之前，你需要对下面的知识有基本的了解：HTML / XHTML通过使用 CSS 我们可以大大提升网页开发的工作效率！在我们的 CSS 教程中，您会学到如何使用 CSS 同时控制多重网页的样式和布局。什么是 CSS?CSS 指层叠样式表 (CascadingStyleSheets) 样式定义如何显示HTML 元素 样式通常存储...转载 2019-06-25 13:05:38 · 320 阅读 · 0 评论 -
《CSS 语法》
CSS 实例CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明:选择器通常是您需要改变样式的 HTML 元素。每条声明由一个属性和一个值组成。属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。CSS 实例CSS声明总是以分号(;)结束，声明组以大括号({})括起来:p {color:r...转载 2019-06-25 13:05:50 · 897 阅读 · 0 评论 -
《CSS Id 和 Class》
id 和 class 选择器如果你要在HTML元素中设置CSS样式，你需要在元素中设置"id" 和 "class"选择器。id 选择器id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 "#" 来定义。以下的样式规则应用于元素属性 id="para1":<!DOCTYPE html&...转载 2019-06-25 13:06:35 · 576 阅读 · 0 评论 -
《CSS 创建》
当读到一个样式表时，浏览器会根据它来格式化 HTML 文档。如何插入样式表插入样式表的方法有三种:外部样式表(External style sheet) 内部样式表(Internal style sheet) 内联样式(Inline style)外部样式表当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观...转载 2019-06-25 13:06:44 · 270 阅读 · 0 评论 -
《CSS Position定位》
CSSPosition(定位)position 属性指定了元素的定位类型。position 属性的五个值：static relative fixed absolute sticky元素可以使用的顶部，底部，左侧和右侧属性定位。然而，这些属性无法工作，除非是先设定position属性。他们也有不同的工作方式，这取决于定位方法。static 定位HTML 元素的默认值，...转载 2019-06-27 14:07:03 · 248 阅读 · 0 评论 -
《CSS Overflow》
CSS 布局 - OverflowCSS overflow 属性用于控制内容溢出元素框时显示的方式。<!DOCTYPE html><html><head><meta charset="utf-8"><title>菜鸟教程(runoob.com)</title><style>#overflowT...转载 2019-06-27 14:19:37 · 3226 阅读 · 0 评论 -
《CSS Float浮动》
什么是 CSS Float（浮动）？CSS 的 Float（浮动），会使元素向左或向右移动，其周围的元素也会重新排列。Float（浮动），往往是用于图像，但它在布局时一样非常有用。元素怎样浮动元素的水平方向浮动，意味着元素只能左右移动而不能上下移动。一个浮动元素会尽量向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。浮动元素之后的元素将围绕它。浮动元...转载 2019-06-27 14:35:34 · 368 阅读 · 0 评论 -
《CSS 对齐》
CSS 布局 - 水平 & 垂直对齐元素居中对齐要水平居中对齐一个元素(如 <div>), 可以使用margin: auto;。设置到元素的宽度将防止它溢出到容器的边缘。元素通过指定宽度，并将两边的空外边距平均分配：<!DOCTYPE html><html><head><meta charset="ut...转载 2019-06-27 15:18:10 · 336 阅读 · 0 评论