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> ...
随机推荐
- linux下flashplayer更新_最新版传送
http://get.adobe.com/cn/flashplayer/ 官网地址,全部最新的flash都在这了,左边选择你要下载的类型,右边点击下载就行了. 最简单的方法就是 下载rpm包,命令rp ...
- EntityFramework、Dapper vs 草根框架性能
EntityFramework.Dapper vs 草根框架性能 扯淡 当前市面上 ORM 很多,有跑车型的,如 Dapper,有中规中矩型的,如 Mybatis.Net,也有重量型的,如 Entit ...
- Python自动化环境搭建
安装配置 Eclipse + PyDev + Robotframework 集成开发环境 1.安装JDK安装目录下的jdk-7u17-windows-i586.exe文件(JAVA开发.运行环境)安装 ...
- Cocos2d-x CCNotificationCenter 通知中心
相信接触过ios开发的人来说对NSNotificationCenter都不陌生.而在cocos2d-x中也参照这个类,提供了CCNotificationCenter这个类,用作通知中心. 那么Noti ...
- uva 12171 hdu 1771 Sculpture
//这题从十一点开始写了四十分钟 然后查错一小时+ 要吐了 这题题意是给很多矩形的左下角(x,y,z最小的那个角)和三边的长(不是x,y,z最大的那个角T-T),为组成图形的面积与表面积(包在内部的之 ...
- windows设置临时环境变量path
所有在命令行下对环境变量的修改只对当前窗口有效,不是永久性的修改. 1.查看当前所有可以的环境变量:输入set查看 2.查看某个环境变量:输入 set 变量名 例如 set path 3.修改环境变量 ...
- linux安装php遇到的问题
第一个问题:configure: error: libjpeg.(a|so) not found 很多人都纳闷儿了,我都安装了的,为什么就找不到呢?找不到其实就应试想到它的搜索位置里面是没有的,要不然 ...
- cmd命令 拷贝某文件夹及其子文件夹文件到其它文件夹
@ECHO OFF cd/d %H:\FileLoc\CNET&cd.. ::echo 拷贝"%H:\FileLoc\CNET"中文件到"H:\FileLocTe ...
- .NET中TextBox控件设置ReadOnly=true后台取不到值 三种解决方法
方法一:不设置ReadOnly属性,通过onfocus=this.blur()来模拟,如下: <asp:TextBox ID="TextBox1" runat="s ...
- HTML5新增加的功能
1.部分代码代替了以前的代码 例如: 获取焦点 旧:document.getElementById("price");.focus; 新:<input ...