请选择 进入手机版 | 继续访问电脑版

乐趣微盟

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
热搜: 活动 交友 discuz
查看: 93|回复: 0

CSS(cascading style sheets级联样式表)中的选择器是什么?

[复制链接]

331

主题

348

帖子

1321

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
1321
发表于 2018-11-23 18:35:00 | 显示全部楼层 |阅读模式
选择器在你想应用一个样式的时候,帮助你去选择元素。举例,下面是简单的被命名为”instro”的样式,他适用于HTML元素显示红色背景
<style>.intro{background-color:red;}</style>
应用上面的”intro”样式给div,我们可以使用”class”选择器,如下图所示
<div class="intro"><p>My name is Shivprasad koirala.</p><p>I write interview questions.</p></div>
如何使用ID值来应用一个CSS样式?
假设,你有一个HTML段落标签,使用id是”mytext”,就和下面的片段中显示的那样
<p id="mytext">This is HTML interview questions.</p>
你可以使用”#”选择器和”id”的名字创建一种样式,并把CSS值应用到段落标签中,因此应用样式到”mytext”元素,我们可以使用”#mytext”,如下所示
<style>#mytext{background-color:yellow;}</style>
迅速修订一些重要的选择器
设置所有段落标签背景色为黄色
div p{ background-color:yellow;}
设置所有div内部的段落标签为黄色背景
div p{ background-color:yellow;}
设置所有div之后的段落标签为黄色背景
div+p{ background-color:yellow;}
设置所有含有“target”属性的变为黄色背景
a[target]{ background-color:yellow;}<a href="http://www.questpond.com">ASP.NET interview questions</a><a href="http://www.questpond.com" target="_blank">c# interview questions</a><a href="http://www.questpond.org" target="_top">.NET interview questions with answers</a>
当控制得到焦点的时候设置所有的元素为黄色背景
input:focus{ background-color:yellow;}
根据相关连接操作设置超链接样式
a:link    {color:green;}a:visited {color:green;}a:hover   {color:red;}a:active  {color:yellow;}
回复

使用道具 举报


QQ|Archiver|手机版|小黑屋|乐趣微盟 ( 青ICP备11000010号-2 )

GMT+8, 2018-12-15 06:00 , Processed in 0.153771 second(s), 35 queries .

Powered by Discuz! X3.3

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表