- 博客(27)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 如何选中最左边的元素？如何选中第n个后所有的元素？
nth-child( n+3)选中从第三个开始所有的元素n>=0nth-child( 3n+1)一行3个选中最左边的元素n>=0
2020-10-16 16:49:42
112
原创 CSS3 border边框
border-radius圆角在 CSS2 中添加圆角棘手。我们不得不在每个角落使用不同的图像。在 CSS3 中，很容易创建圆角。div{border:2px solid;border-radius:25px;}box-shadow盒阴影CSS3 中的 box-shadow 属性被用来添加阴影:div{box-shadow: 10px 10px 5px #888888;}border-image边界图片有了 CSS3 的 border-image 属性，你可以使用图像.
2020-07-15 13:49:56
165
原创 伪元素
CSS伪元素是用来添加一些选择器的特殊效果。语法伪元素的语法：selector:pseudo-element {property:value;}CSS类也可以使用伪元素：selector.class:pseudo-element {property:value;}:first-line 伪元素“first-line” 伪元素用于向文本的首行设置特殊样式。在下面的例子中，浏览器会根据 “first-line” 伪元素中的样式对 p 元素的第一行文本进行格式化：p:first-line.
2020-07-09 09:42:03
314
原创 伪类
CSS伪类是用来添加一些选择器的特殊效果。语法伪类的语法：selector:pseudo-class {property:value;}CSS类也可以使用伪类：selector.class:pseudo-class {property:value;}## anchor伪类在支持 CSS 的浏览器中，链接的不同状态都可以以不同的方式显示a:link {color:#FF0000;} /* 未访问的链接 */a:visited {color:#00FF00;} /* 已访问的链接 .
2020-07-09 09:39:54
166
原创 组合选择符
后代选择器后代选择器用于选取某元素的后代元素。以下实例选取所有 元素插入到 元素中:div p{ background-color:yellow;}子元素选择器与后代选择器相比，子元素选择器（Child selectors）只能选择作为某元素子元素的元素。以下实例选择了元素中所有直接子元素 ：div>p{ background-color:yellow;}相邻兄弟选择器相邻兄弟选择器（Adjacent sibling selector）可选择紧接在另一元素.
2020-07-09 09:37:13
89
原创 水平&垂直对齐
margin元素居中对齐要水平居中对齐一个元素(如 ), 可以使用 margin: auto;。设置到元素的宽度将防止它溢出到容器的边缘。元素通过指定宽度，并将两边的空外边距平均分配：.center { margin: auto; width: 50%; border: 3px solid green; padding: 10px;}注意: 如果没有设置 width 属性(或者设置 100%)，居中对齐将不起作用。text-align文本居中对齐如果仅仅是为.
2020-07-07 15:51:03
359
原创 float浮动
什么是 CSS Float（浮动）？CSS 的 Float（浮动），会使元素向左或向右移动，其周围的元素也会重新排列。Float（浮动），往往是用于图像，但它在布局时一样非常有用。元素怎样浮动元素的水平方向浮动，意味着元素只能左右移动而不能上下移动。一个浮动元素会尽量向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。浮动元素之后的元素将围绕它。浮动元素之前的元素将不会受到影响。如果图像是右浮动，下面的文本流将环绕在它左边：img{ float:right;}彼此.
2020-07-07 15:47:17
136
原创 overflow
CSS overflow 属性可以控制内容溢出元素框时在对应的元素区间内添加滚动条。overflow属性有以下值：值描述visible默认值。内容不会被修剪，会呈现在元素框之外。hidden内容会被修剪，并且其余内容是不可见的。scroll内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。auto如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。inherit规定应该从父元素继承 overflow 属性的值。****注意:**ove.
2020-07-07 15:44:37
317
原创 position定位
static 默认定位HTML 元素的默认值，即没有定位，遵循正常的文档流对象。静态定位的元素不会受到 top, bottom, left, right影响。div.static { position: static; border: 3px solid #73AD21;}fixed 相对于浏览器定位元素的位置相对于浏览器窗口是固定位置。即使窗口是滚动的它也不会移动：p.pos_fixed{ position:fixed; top:30px; ri.
2020-07-07 15:43:20
113
转载 Display(显示) 与 Visibility（可见性）
display属性设置一个元素应如何显示，visibility属性指定一个元素应可见还是隐藏。隐藏元素 - display:none或visibility:hidden隐藏一个元素可以通过把display属性设置为"none"，或把visibility属性设置为"hidden"。但是请注意，这两种方法会产生不同的结果。visibility:hidden可以隐藏某个元素，但隐藏的元素仍需占用与未隐藏之前一样的空间。也就是说，该元素虽然被隐藏了，但仍然会影响布局。h1.hidden {visibil.
2020-07-07 15:42:04
503
原创 dimension尺寸
所有CSS 尺寸 (Dimension)属性属性描述height设置元素的高度。line-height设置行高。max-height设置元素的最大高度。max-width设置元素的最大宽度。min-height设置元素的最小高度。min-width设置元素的最小宽度。width设置元素的宽度。...
2020-07-07 15:38:34
544
原创 分组和嵌套选择器
分组选择器在样式表中有很多具有相同样式的元素。h1 { color:green;}h2 { color:green;}p { color:green;}为了尽量减少代码，你可以使用分组选择器。每个选择器用逗号分隔。在下面的例子中，我们对以上代码使用分组选择器：h1,h2,p { color:green;}嵌套选择器它可能适用于选择器内部的选择器的样式。在下面的例子设置了三个样式：p{ }: 为所有 p 元素指定一个样式。.marked{.
2020-07-07 15:37:08
139
原创 padding填充
当元素的 padding（填充）内边距被清除时，所释放的区域将会受到元素背景颜色的填充。单独使用 padding 属性可以改变上下左右的填充。可能的值值说明length定义一个固定的填充(像素, pt, em,等)%使用百分比值定义一个填充填充- 单边内边距属性在CSS中，它可以指定不同的侧面不同的填充：padding-top:25px;padding-bottom:25px;padding-right:50px;padding-left:50px;.
2020-07-07 15:35:31
372
原创 margin外边距
margin 清除周围的（外边框）元素区域。margin 没有背景颜色，是完全透明的。margin 可以单独改变元素的上，下，左，右边距，也可以一次改变所有的属性。可能的值值说明auto设置浏览器边距。这样做的结果会依赖于浏览器length定义一个固定的margin（使用像素，pt，em等）%定义一个使用百分比的边距Margin可以使用负值，重叠的内容。Margin - 单边外边距属性margin-top:100px;margin-bottom:..
2020-07-07 15:33:25
172
原创 outline轮廓
轮廓（outline）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。轮廓（outline）属性指定元素轮廓的样式、颜色和宽度。所有CSS 轮廓（outline）属性“CSS” 列中的数字表示哪个CSS版本定义了该属性(CSS1 或者CSS2)。属性说明值CSSoutline在一个声明中设置所有的轮廓属性outline-coloroutline-styleoutline-widthinherit2outline-color设置轮廓的颜色c.
2020-07-07 15:30:58
168
原创 border边框
边框属性CSS边框属性允许你指定一个元素边框的样式和颜色。border-style边框样式边框样式属性指定要显示什么样的边界。border-style 值:none: 默认无边框border-width边框宽度为边框指定宽度有两种方法：可以指定长度值，比如 2px 或 0.1em(单位为 px, pt, cm, em 等)，或者使用 3 个关键字之一，它们分别是 thick 、medium（默认值） 和 thin。**注意：**CSS 没有定义 3 个关键字的具体宽度，所以一个用户可能把.
2020-07-07 10:55:27
240
原创 div盒子模型
div盒子模型css 盒子模型所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。Margin(外边距) - 清除边框外的区域，外边距是透明的。Border(边框) - 围绕在内边距和内容外的边框。Padding(内边距) - 清除内容周围的区域，内边距是透明的。Content(内容) - 盒子的内
2020-07-06 16:01:50
270
转载 table表格
border表格边框指定CSS表格边框，使用border属性。下面的例子指定了一个表格的Th和TD元素的黑色边框：table, th, td{ border: 1px solid black;}请注意，在上面的例子中的表格有双边框。这是因为表和th/ td元素有独立的边界。为了显示一个表的单个边框，使用 border-collapse属性。border-collapse折叠边框border-collapse 属性设置表格的边框是否被折叠成一个单一的边框或隔开：table{.
2020-07-06 15:57:22
1417
原创 ul列表
list-style-type列表标记类型list-style-type属性指定列表项标记的类型是：ul.a {list-style-type: circle;}ul.b {list-style-type: square;} ol.c {list-style-type: upper-roman;}ol.d {list-style-type: lower-alpha;}list-style-image指定列表标记图片要指定列表项标记的图像，使用列表样式图像属性：ul{ lis.
2020-07-06 15:51:43
843
原创 Font字体
CSS字体属性定义字体，加粗，大小，文字样式。font-family字体font-family 属性设置文本的字体系列。font-family 属性应该设置几个字体名称作为一种"后备"机制，如果浏览器不支持第一种字体，他将尝试下一种字体。注意: 如果字体系列的名称超过一个字，它必须用引号，如Font Family：“宋体”。多个字体系列是用一个逗号分隔指明：p{font-family:"Times New Roman", Times, serif;}font-size文本大小font-.
2020-07-06 15:45:23
496
原创 Text文本格式
color文本颜色颜色属性被用来设置文字的颜色。颜色是通过CSS最经常的指定：十六进制值 - 如: ＃FF0000一个RGB值 - 如: RGB(255,0,0)颜色的名称 - 如: red一个网页的背景颜色是指在主体内的选择：body {color:red;}h1 {color:#00ff00;}h2 {color:rgb(255,0,0);}提示：对于W3C标准的CSS：如果你定义了颜色属性，你还必须定义背景色属性。text-align文本排列文本排列属性是用来设置文本..
2020-07-06 15:42:30
1445
原创 background背景
background-color背景颜色background-color 属性定义了元素的背景颜色.页面的背景颜色使用在body的选择器中:body {background-color:#b0c4de;}CSS中，颜色值通常以以下方式定义:十六进制 - 如："#ff0000"RGB - 如：“rgb(255,0,0)”颜色名称 - 如：“red”background-image背景图像background-image 属性描述了元素的背景图像.默认情况下，背景图像进行平铺重复显示，.
2020-07-06 15:35:57
239
1
转载 css创建
当读到一个样式表时，浏览器会根据它来格式化 HTML 文档。外部样式表(External style sheet)当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。每个页面使用 标签链接到样式表。 标签在（文档的）头部：<head><link rel="stylesheet" type="text/css" href="mystyle.css"></head>浏览器会从文件 m.
2020-07-05 21:43:28
1785
原创 id和class
id 和 class 选择器如果你要在HTML元素中设置CSS样式，你需要在元素中设置"id" 和 "class"选择器。id 选择器id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 “#” 来定义。以下的样式规则应用于元素属性 id=“para1”:#para1{ text-align:center; color:red;}注意：ID属性不要以数字开头，数字开头的ID在 Mozill..
2020-07-05 21:40:56
164
原创 css基础语法
CSS 格式CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明:
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人