CSS :lang 选择器
实例
每个<p>元素lang属性值等于”it(Italian)” 的选择的样式：
p:lang(it)
{
background:yellow;
}
定义和用法
:lang 向带有指定 lang 属性开始的元素添加样式。
注意: 值是整个单词，单独像lang=”en”，或者使用连字符(-)如lang =……继续阅读 »
2年前 (2022-09-04) 72浏览 0评论
0个赞
CSS :before 选择器
实例
每个 <p>元素之前插入内容：
p:before
{
content:”Read this: “;
}
定义和说明
:before 选择器向选定的元素前插入内容。
使用content 属性来指定要插入的内容。
浏览器支持
表格中的数字表示支持该属性的第一个浏览器版本号。
选择器
::before
……继续阅读 »
2年前 (2022-09-04) 98浏览 0评论
0个赞
CSS :first-line 选择器
实例
每个<p>元素的第一行选择的样式：
p:first-line
{
background-color:yellow;
}
定义和用法
:first-line选择器用来指定选择器第一行的样式。
注意::first-line选择器可以使用以下属性：
font properties
color properties
background……继续阅读 »
2年前 (2022-09-04) 131浏览 0评论
0个赞
CSS :first-child 选择器
实例
匹配 <p> 的父元素的第一个<p>元素
p:first-child
{
background-color:yellow;
}
定义和用法
:first-child 选择器匹配其父元素中的第一个子元素。
浏览器支持
表格中的数字表示支持该属性的第一个浏览器版本号。
选择器
:first-child
4.0
7……继续阅读 »
2年前 (2022-09-04) 141浏览 0评论
0个赞
CSS :focus 选择器
实例
一个输入字段获得焦点时选择的样式：
input:focus
{
background-color:yellow;
}
定义和用法
:focus选择器用于选择具有焦点的元素。
提示: :focus选择器接受键盘事件或其他用户输入的元素。
浏览器支持
表格中的数字表示支持该属性的第一个浏览器版本号。
选择器
:focus
4.0
8.0
2……继续阅读 »
2年前 (2022-09-04) 289浏览 0评论
0个赞
CSS :first-letter 选择器
实例
每个 <p>元素的第一个字母选择的样式：
p:first-letter
{
font-size:200%;
color:#8A2BE2;
}
定义和用法
:first-letter选择器用来指定元素第一个字母的样式。
提示: :first-letter选择器可以使用以下属性：
font properties
color p……继续阅读 »
2年前 (2022-09-04) 142浏览 0评论
0个赞
CSS :hover 选择器
实例
选择鼠标移到链接上的样式：
a:hover
{
background-color:yellow;
}
定义和用法
:hover在鼠标移到链接上时添加的特殊样式。
提示: :hover 选择器器可用于所有元素，不仅是链接。
提示: :link 选择器设置了未访问过的页面链接样式, :visited 选择器设置访问过的页面链接的样式
:active选择器设置当你点击链接时……继续阅读 »
2年前 (2022-09-04) 118浏览 0评论
0个赞
CSS :visited 选择器
实例
选择访问过得链接样式：
a:visited
{
background-color:yellow;
}
定义和用法
:visited向访问过的链接添加特殊的样式。
Tip: 使用:visited选择器设置访问过的页面链接的样式， :hover选择器当有鼠标悬停在其上的链接样式，:active 选择器设置当你点击链接时的样式。
浏览器支持
表格中的数字表示支……继续阅读 »
2年前 (2022-09-04) 107浏览 0评论
0个赞
CSS :active 选择器
实例
选择激活的链接样式：
a:active
{
background-color:yellow;
}
定义和用法
:active向活动的链接添加特殊的样式。
当你点击一个链接时它变成活动链接。
提示: :link 选择器设置了未访问过的页面链接样式, :visited 选择器设置访问过的页面链接的样式,
:hover 选择器当有鼠标悬停在其上的链接样式。
注意……继续阅读 »
2年前 (2022-09-04) 148浏览 0评论
0个赞
CSS [attribute|=value] 选择器
实例
选择 lang 属性等于 en，或者以 en- 为开头的所有元素，并设置其样式：
[lang|=en]
{
background-color:yellow;
}
定义和用法
[attribute|=value] 选择器用于选择以指定值开头的属性值的元素。
注意:该值是整个单词，无论是单独像 lang=”en”，或者像连字……继续阅读 »
2年前 (2022-09-04) 116浏览 0评论
0个赞
CSS :link 选择器
实例
选择未访问链接样式：
a:link
{
background-color:yellow;
}
定义和用法
:link向未访问的链接添加特殊的样式。
注意: :link 选择器对已经访问的链接没有样式。
提示: 使用 :visited 选择器设置访问过的页面链接的样式，:hover选择器当有鼠标悬停在其上的链接样式，:active 选择器设置当你点击链接时的样式。……继续阅读 »
2年前 (2022-09-04) 140浏览 0评论
0个赞
CSS [attribute~=value] 选择器
实例
选择标题属性包含单词”flower”的所有元素
[title~=flower]
{
background-color:yellow;
}
定义和用法
[attribute~=value] 选择器用于选择属性值包含一个指定单词的元素。
浏览器支持
所有主流浏览器都支持[attribute~=value]选择器。……继续阅读 »
2年前 (2022-09-04) 114浏览 0评论
0个赞
CSS [attribute] 选择器
实例
选择所有带有target属性的 <a>元素：
a[target]
{
background-color:yellow;
}
浏览器支持
所有主流浏览器都支持 [attribute] 选择器。
浏览器支持
所有主流浏览器都支持 [attribute]选择器。
Note: [attribute] 在IE8中运行，必须声明 <!DOC……继续阅读 »
2年前 (2022-09-04) 140浏览 0评论
0个赞
CSS [attribute=value] 选择器
实例
选择所有使用target=”_blank”的a元素
a[target=_blank]
{
background-color:yellow;
}
<h2定义和用法
[attribute=value] 选择器用于选择指定了属性和值的元素。
浏览器支持
所有主流浏览器都支持[attribute=value]选择……继续阅读 »
2年前 (2022-09-04) 105浏览 0评论
0个赞
CSS element+element 选择器
实例
选择所有紧接着 <div> 元素之后的第一个 <p> 元素:
div+p
{
background-color:yellow;
}
定义和用法
element+element 选择器用于选择（不是内部）指定的第一个元素之后紧跟的元素。
浏览器支持
所有主流浏览器都支持 element+element 选择器。
注意: e……继续阅读 »
2年前 (2022-09-04) 107浏览 0评论
0个赞
CSS element>element 选择器
实例
选择所有父级是 <div> 元素的 <p> 元素：
div>p
{
background-color:yellow;
}
定义和用法
element>element 选择器用于选择特定父元素。
注意: 元素没有被选中是不能直接指定父级的子元素。
浏览器支持
所有主流浏览器都支持 element&……继续阅读 »
2年前 (2022-09-04) 72浏览 0评论
0个赞
CSS element element 选择器
实例
选择<div>元素内的所有<p>元素:
div p
{
background-color:yellow;
}
定义和用法
element element选择器用于选择元素内部的元素。
浏览器支持
所有主流浏览器都支持element,element选择器。
……继续阅读 »
2年前 (2022-09-04) 130浏览 0评论
0个赞
CSS element,element 选择器
实例
选择所有 <p> 元素和 <h1> 元素:
h1,p
{
background-color:yellow;
}
定义和用法
几个元素具有相同的样式，用逗号分隔每个元素的名称。
浏览器支持
所有主流浏览器都支持 element,element选择器。
……继续阅读 »
2年前 (2022-09-04) 105浏览 0评论
0个赞
CSS element 选择器
实例
选择所有<p> 元素 :
p
{
background-color:yellow;
}
定义和用法
The element 选择器选择指定元素名称的所有元素。
Browser Support
所有主流浏览器都支持element 选择器。
……继续阅读 »
2年前 (2022-09-04) 114浏览 0评论
0个赞
CSS * 选择器
实例
选择所有元素，并设置其背景色：
*
{
background-color:yellow;
}
定义和用法
* 选择器选择所有元素。
* 选择器也可以选择另一个元素内的所有元素:
实例
选择<div>元素内的所有元素：
div *
{
background-color:yellow;
}
Browser Support
所有主流浏览器都支……继续阅读 »
2年前 (2022-09-04) 112浏览 0评论
0个赞
CSS .class 选择器
实例
Select and style all elements with class=”intro”:
.intro
{
background-color:yellow;
}
定义和用法
The .class选择器是指定类的所有元素的样式。
Browser Support
所有主流浏览器都支持.class选择器
更多实例
实例
St……继续阅读 »
2年前 (2022-09-04) 147浏览 0评论
0个赞
CSS #id Selector
实例
为 id=”firstname” 元素添加指定样式:
#firstname
{
background-color:yellow;
}
定义和用法
#id选择器指定具有ID的元素的样式。
浏览器支持
所有主流浏览器都支持 #id 选择器。
……继续阅读 »
2年前 (2022-09-04) 78浏览 0评论
0个赞
CSS !important 规则
什么是 !important
CSS 中的 !important 规则用于增加样式的权重。
!important 与优先级无关，但它与最终的结果直接相关，使用一个 !important 规则时，此声明将覆盖任何其他声明。
实例
#myid {
background-color: blue;
}
.myclass {
background-color: gray;
}
p ……继续阅读 »
2年前 (2022-07-26) 221浏览 0评论
0个赞
CSS 创建
当读到一个样式表时，浏览器会根据它来格式化 HTML 文档。
如何插入样式表
插入样式表的方法有三种:
外部样式表(External style sheet)
内部样式表(Internal style sheet)
内联样式(Inline style)
外部样式表
当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。每个……继续阅读 »
2年前 (2022-07-26) 230浏览 0评论
0个赞
CSS 背景
CSS 背景属性用于定义HTML元素的背景。
CSS 属性定义背景效果:
background-color
background-image
background-repeat
background-attachment
background-position
背景颜色
background-color 属性定义了元素的背景颜色.
页面的背景颜色使用在body的选择器中:
实例
body {ba……继续阅读 »
2年前 (2022-07-25) 81浏览 0评论
0个赞
CSS 表单
一个表单案例，我们使用 CSS 来渲染 HTML 的表单元素：
CSS 实例
input[type=text], select {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;
box-siz……继续阅读 »
2年前 (2022-07-24) 73浏览 0评论
0个赞
CSS 图像拼合技术
图像拼合
图像拼合就是单个图像的集合。
有许多图像的网页可能需要很长的时间来加载和生成多个服务器的请求。
使用图像拼合会降低服务器的请求数量，并节省带宽。
图像拼合 – 简单实例
与其使用三个独立的图像，不如我们使用这种单个图像（”http://www.fuwuqijishu.com/wp-content/uploads/2022/05/20220515092406……继续阅读 »
2年前 (2022-07-23) 411浏览 0评论
0个赞
.dropbtn {
background-color: #4CAF50;
color: white;
padding: 16px;
font-size: 16px;
border: none;
cursor: pointer;
}
.dropdown {
position: relative;
display: inline-block;
}
.dro……继续阅读 »
2年前 (2022-07-17) 217浏览 0评论
0个赞
CSS 列表
CSS 列表属性作用如下：
设置不同的列表项标记为有序列表
设置不同的列表项标记为无序列表
设置列表项标记为图像
列表
在 HTML中，有两种类型的列表：
无序列表 ul – 列表项标记用特殊图形（如小黑点、小方框等）
有序列表 ol – 列表项的标记有数字或字母
使用 CSS，可以列出进一步的样式，并可用图像作列表项标记。
无序列表如下所示:
Coffee
T……继续阅读 »
2年前 (2022-07-17) 72浏览 0评论
0个赞
CSS 计数器
CSS 计数器通过一个变量来设置，根据规则递增变量。
使用计数器自动编号
CSS 计数器根据规则来递增变量。
CSS 计数器使用到以下几个属性：
counter-reset – 创建或者重置计数器
counter-increment – 递增变量
content – 插入生成的内容
counter() 或 counters() 函数 – 将计数器……继续阅读 »
2年前 (2022-07-16) 193浏览 0评论
0个赞
