CSS3学习----选择器、字体
属性选择器:
[att*=val]{}若att元素属性值包括val指定字符,则使用该样式
[att^=val]{}若att元素属性值开头字符为val,则使用该样式
[att&=val]{}若att元素属性值结尾字符为val,则使用该样式
例:
<style type="text/css">
[id^=section1]{
background-color: yellow;
}
</style>
<div id="section2">演示样例文本2</div>
<div id="subsection1">演示样例文本1-1</div>
<div id="subsection2">演示样例文本1-2</div>
<div id="subsection2-1">演示样例文本2-1</div>
<div id="subsection2-2">演示样例文本2-2</div>
target选择器:
页面内href跳转时,又一次定义目标的属性
font字体:曾经的版本号网页中应用的特殊字体仅仅有在client有这个字体时候该字体才干正常显示,
而css3支持从server中获取字体,也就是说你把字体文件放到font目录,能够直接通过url使用这个字体
这一新的变化真的带来了非常大的便利。例:
@font-face{
font-family: WebFont;
src:url('font/FZJZFW.TTF') format("truetype");
font-weight: normal;
}
article{
font-family: WebFont;
}
<article>
<h1>文章内容</h1>
<p>网页级内容区块的正文</p>
<section>
<h3>section级内容的正文</h3>
<p>section级内容区块的正文</p>
</section>
</article>
CSS3学习----选择器、字体的更多相关文章
- [CSS3] 学习笔记-选择器详解(三)
1.UI元素状态伪类选择器 在CSS3的选择器中,除了结构性伪类选择器外,还有一种UI元素伪类选择器.这些选择器的共同特征是:指定的样式只有当元素处于某种状态时才起作用,在默认状态下不起作用.在CSS ...
- CSS3学习笔记(1)-CSS3选择器
p{ font-size: 15px; text-indent: 2em; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid ...
- css3学习文档
什么是CSS3? CSS3是CSS2的升级版本,3只是版本号,它在CSS2.1的基础上增加了很多强大的新功能. 目前主流浏览器chrome.safari.firefox.opera.甚至360都已经支 ...
- css和css3学习
css和css3学习 css布局理解 css颜色大全 样式的层叠和继承 css ::before和::after伪元素的用法 中文字体font-family常用列表 cursor属性 css选择器 F ...
- CSS3 教程 选择器 标记一下防止 要找时404
客 » Airen的博客 CSS3 选择器——基本选择器 作者:大漠 日期:2011-08-09 点击:6418 CSS的选择器,我想大家并不会陌生吧,因为天天在使用,但对于CSS3的选择器,要运 ...
- 我的CSS3学习笔记
1.元字符使用: []: 全部可选项 ||:并列 |:多选一 ?: 0个或者一个 *:0个或者多个 {}: 范围 2.CSS3属性选择器: E[attr]:存在attr属性即可: E[attr=val ...
- HTML5与CSS3权威指南之CSS3学习记录
title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...
- CSS3学习笔记1-选择器和新增属性
前言:之前自学了一些关于CSS3的知识,在学习过程中也遇到过坑,不过总算磕磕绊绊的学习完了关于CSS3的相关知识,于是最近把之前的笔记和代码整理了一下,也算是一个对CSS3知识的回顾复习吧,也希望能够 ...
- CSS3 ::selection选择器
一.介绍 之前看到有些网站选中内容的颜色和背景色都不是平时看到的蓝色和白色.今天有兴趣查看了一下,原来是一个很简单的CSS3的选择器::selection的用法. 上例子: <style> ...
随机推荐
- 软件测试学习日志————round 1 some questions of two small programs
Below are four faulty programs. Each includes a test case that results in failure. Answer the follow ...
- Scala数组操作实战详解
增删改查,要注意的是,Array数组是定长数组,ArrayBuffer数组才是变长数组. 其他集合也存在可变不可变.例如,List,Set,Map 多维数组定义方法与Java类似.
- 修改 tomcat 内存
在Jetty 的VM参数中设置: -Xms256m -Xmx512m -XX:MaxNewSize=256m -XX:MaxPermSize=256m 在tomcat运行环境中设置: window环境 ...
- 一个不错的文章-【原创】2014年信息安全产品及厂家分类-SOC&SIEM安全厂家 | Srxh1314
转载:http://www.srxh1314.com/2014-sec-company-soc-siem.html http://www.bugsec.org/1598.html http://www ...
- 利用指针突破C++编译器的防线
C++ 面向对象的一大特性就是封装,使用不同的访问控制符来控制外接对其的访问权限.比如: class A { public: A(): i(){} void print(){ cout << ...
- 使用AFNetworking请求新浪微博数据接口出错解决办法
在使用AFNetworking请求新浪微博数据接口时会出这样的错误,如 这样的错误说明,AFNetworking无法处理这样的数据格式.所以,我们需要修改AFNetworking中的一些接收数据格式. ...
- 音乐ID3 中 专辑封面解析(APIC帧)
ID3V2 中 APIC 帧标识 专辑封面.前几天 百度 谷歌 都没有找到具体的说明.有点小伤人. 最好参考 Android 中的 id3.cpp 以及一个java 开源 id3 库.找到这里的规格 ...
- RDIFramework.NET(.NET快速信息化系统开发框架) Web版介绍
RDIFramework.NET(.NET快速信息化系统开发框架) Web版介绍 B/S结构(Browser/Server,浏览器/服务器模式),是WEB兴起后的一种网络结构模式,WEB浏览器是客户 ...
- Android中的数据存储
Android中的数据存储主要分为三种基本方法: 1.利用shared preferences存储一些轻量级的键值对数据. 2.传统文件系统. 3.利用SQLite的数据库管理系统. 对SharedP ...
- 一个解析url参数方法
function getRequestParameter(a) { var b = document.location.search || document.location.hash; if (a ...