css分类及其它技巧
.分类,所有的HTML标签都可以 用作选择,并附加样式表说明.但是如果 你想达到的目的比这还要复杂该如何处 理呢?比如,你想让主体文字的1段用绿 色显示,第2段用紫色显示,而第3段用 灰色显示,你能做到吗? 这种情况下分类将发挥作用。你可以将 段落P分成3种不同的类别,每一类应用 不同的样式表说明。这些规则(不论是 植入的还是外部样式表文件)将以以下 方式显示:
P.first { color: green } P.second { color: purple } P.third { color: gray }
- 你的HTML代码如下:
<P class="first">The first paragraph, with a class name of "first."</P> <P class="second">The second paragraph, with a class name of "second."</P> <P class="third">The third paragraph, with a class name of "third."</P>
你可以给类别起任何一种名字,但不要 忘了在样式表规则中类别名称前加一个 句号(即英文中的 .)
你还可以生成不加任何HTML标签的分类:
.first { color: green }
这种方式更加灵活,因为现在我们可以 将CLASS=first用于任何HTML标签,并应 用到网页<BODY>中,而设定的文字将以 绿色显示。 情景选择: 如果你想让所有加重显示的文字都以红 色显示,但条件是只有当这些加显示的 文字出现在通常的主体文字内时。不可 能吗?利用样式表可以实现你最狂野的 梦想。情景选择将使你梦想成真,心想 事成。情景选择要求你设定一个可以执 行选择说明的情景即可。
P B { color: red }
<H1><B>Emma Thompson</B>, Actress </H1> <P>Dramatic actor, inspired comedienne. Is there <B>nothing</B> she can't do?</P>
样式表的规则告诉浏览器只将所有<P>之 内加重显示的文字以红色显示。所以, <P>之外标题的加重文字不会以红色显示, 而<P>之内的文字则是。 注释 即使是用样式表制作出的非常简练的代 码也应该加上注释。利用样式表代码就 可以做到这一点。例:
P.first { color: green } /* green for the first paragraph of every page */H1 { text-indent: 10px; font-family: verdana } IMG { margin-top: 100px } /* give all images a top margin */
转载于:https://www.cnblogs.com/TheSaga/archive/2012/08/02/2620499.html
css分类及其它技巧相关推荐
- css背景渐变的技巧与方法
[发帖际遇]: the_truth玩宠物的时候不幸损失威望13. css背景渐变的技巧与方法 用css实现网页背景渐变的代码如下: 一.从上往下渐变 Example Source Code: body ...
- 分类问题后处理技巧CAN,近乎零成本获取效果提升
文 | 苏剑林 编 | 智商掉了一地 单位 | 追一科技 思想朴素却不平凡的分类问题后处理技巧,浅显易懂的讲解,拿来吧你! 顾名思义,本文将会介绍一种用于分类问题的后处理技巧--CAN(Classif ...
- 做网页很实用代码集合和CSS制作网页小技巧整理
做网页很实用代码集合 控制横向和纵向滚动条的显隐?<body style="overflow-y:hidden"> 去掉x轴 <body style=" ...
- html中如何消除左边界,元素的局中对齐问题,CSS盒属性使用技巧,前端开发必备...
本文介绍的盒属性应用包括以下几点: 块级元素在容器中的水平居中 绝对定位的块级元素在页面中水平垂直居中 去掉所有HTML元素的边界和填充值 去掉无序列表左侧为项目符号留出的位置 一.块级元素在容器中的 ...
- css 小经验: 重构css的优化与技巧
一.使用css缩写 使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则请参看<常用css缩写语法总结>,这里就不展开描述. 二.明确定义单位,除非值为0 忘记定义尺 ...
- [PLM专题] 十分钟了解文本分类通用训练技巧
前言 欢迎大家来到预训练语言模型的专题系列分享,本篇推送是该专题系列的第三篇.在前两篇推送[萌芽时代],[风起云涌]中,我们分享了该领域的奠基文章以及声名鹊起却生不逢时的ELMo模型,本期我们带来的文 ...
- CSS一些实用的技巧
css 字体简写规则 当使用css定义字体时你可能会这样做: font-size: 1em; line-height: 1.5em; font-weight: bold; font-style: it ...
- CSS布局奇淫技巧之--各种居中
居中是我们使用css来布局时常遇到的情况.使用css来进行居中时,有时一个属性就能搞定,有时则需要一定的技巧才能兼容到所有浏览器,本文就居中的一些常用方法做个简单的介绍. 注:本文所讲方法除了特别说明 ...
- Css 分类 属性 选择器
Css 层叠样式表 美化页面的小工具 分类: 内联 (行内)在标签内部以属性的形式呈现,属性名style 内嵌 head标签内以标签形式呈现,标签名style 外部 head标签内 加link标签 引 ...
最新文章
- 2022-2028年中国硫化橡胶粉行业市场发展调研及竞争战略分析报告
- ddos攻击python_Python基于http的ddos攻击代码
- Win8 Hyper-V虚拟机 安装运行Ubuntu教程
- OpenCV图像金字塔:高斯金字塔、拉普拉斯金字塔总结
- WinrRar4.2 扩展名欺骗0Day
- 键盘消息捕获--MFC
- 三行代码让你的博客访问量上百万
- linux登录用户目录,linux命令
- 【架构师面试题库1】—etcd高可用集群搭建
- 3 万字 51 张图教你 CPU、内存、操作系统硬核知识!
- 推荐系统如何一键实现工业级部署? ElasticCTR 百度开讲
- 计算机二级基础知识微盘,计算机二级C++基础知识(整理版).pdf
- Javascript培训PPT
- Session 钝化机制
- 已会背诵英文文章 How To Boost Your Confidence
- 读取、回收和重用:使用 Excel、XML 和 Java 技术轻松搞定报告,第 2 部分
- 鼠标移动事件(鼠标移动到主菜单上显示子菜单)
- 缠论是一种交易方法炒股是不是一定要学习缠论(利用缠论如何选股)
- 东莞群控服务器系统,群控服务器远程连接工具
- CentOS7.9 安装中文字体命令
热门文章
- jstree禁用父节点点击_Jstree 使用CheckBox插件 选中父节点时被禁用的子节点也会选中问题...
- android okhttp+解析json( okhttp 工具类)
- 24速算c语言实训报告ppt,C语言课程设计(速算24).doc
- ORACLE数据库测试题(一)
- Java EE设计思想
- apolloxlua include函数
- poj3557 Map Generator
- 使用REST风格架构您需要知道的一些事
- Java界面设计的用途
- 【JAVA源码分析——Java.lang】String源码分析