文档章节

css高级教程第一章笔记

Q_z
 Q_z
发布于 2014/01/30 20:59
字数 1095
阅读 238
收藏 19
点赞 0
评论 0

 

大年30,今天刚刚看完第一章,上传上来一些笔记。

1、css:可以将文档的表现部分与内容分开

2、id:是唯一的,id可以用来标识持久的结构性元素,如:主导航和内容区域,id还可以用来表示一次性元素。链接的表单
3、class:适合标识内容的类型或相似的条目。
4、多类症的问题:不要过度的依赖的类

5、div:
 一、添加结构的一个元素是div元素
 二、div实际上代表部分、将文档分割为有意义的区域的方法
 三、通过将主要内容区域包围在div中并分配id就可以在文档中添加结构和意义。
-----------------------万恶的分割线-------------------------------------

1.1.2  文档类型、doctype切换和浏览器模式

DTD(文档类型定义)


IME type的缩写为(Multipurpose Internet Mail Extensions)代表互联网媒体类型(Internet media type),MIME使用一个简单的字符串组成,最初是为了标识邮件Email附件的类型,在html文件中可以使用content-type属性表示,描述了文件类型的互联网标准。MIME类型能包含视频、图像、文本、音频、应用程序等数据。

浏览器模式

标准模式和怪异模式


doctype切换
 一、xhtml文档包含形式完整的doctype-----------------标准模式表现。
 二、严格DTD的doctype  -------------标准模式表现。
 三、过渡的DTD和url ----------标准模式表现。
 四、过渡的DTD没有url ----------怪异模式表现。
 五、doctype不存在和形式不正确 ----------------怪异模式表现

doctype 是否存在的选择是方法的效果被称为doctype切换

doctype切换是浏览器用来区分遗留文档和符合标准的文档的手段

选择了错误的DOCTYPE,页面就一怪异模式表现,会出现很多不可估量的错误


每个页面的都要的包含形式完整的doctype声明,并且要选择严格的DTD

-----------------------可恶的风格线---------------------------------
1.2  为样式找到目标


 类型选择器-----用来寻找特点类型的元素(标签)也称为(元素选择器)
 后代选择器-----用来寻找特点元素和元素组的后代,


#mainContent h1 {font-size:1.8em;}
这段代码有

类型选择(元素选择器) id选择器 后代选择器

注意事项:
发现文档中添加了许多没用的类,那么可能就是文档结构不合理的一个警告,一定要记住分析元素之间的差异,常常会发现差异是他们在页面上出现的位置,谨记不要给元素指定不同类,而是将一个类或id应用透明的祖先,然后使用后代选择器定位他们

*伪类选择器
文档结构之外的其他条件对元素应用样式,就可以使用伪类选择器

:link 和visited称为链接伪类--------------只能应用于锚元素
:hover、:active、:focus称为动态伪类--------可以用于任何元素

通用选择器


高级选择器(有兼容性问题)
 1、子选择器
  只选择元素的直接后代,叫子元素
  特点:只会在选择的子类上应用样式,其他的子类不会有任何样式
   #nav li {只会对li产生样式};
  例子:demo(子类选择器).html
 2.通用选择器(兼容的ie6和更低的版本)
  可以使用通用选择器模拟子选择器的效果,
  具体的步骤:
   一、先在所有后代上应用你希望的子元素具有的样式
   二、使用通用选择器覆盖子元素的后代上的样式
   #nav li *{background:url(12.png)no-repeat left top;}

 3.一个元素与另一个元素的相邻关系对它应用样式。相邻选择器可用于定位同一个父元素下某个元素之后的元素   


 h1 + p {

 }

 

 属性选择器

  可以根据某个属性是否存在或属性的值来寻找元素
  一些属性可以有多个值,值之间用空格分隔,属性选择器允许更具属性值之一来寻找元素
  a[rel~='friend']{
   background-image:url(12.png);
  }

  <a href="www.baidu.com" rel="friend met colleague">xxxxx</a>


  样式表中使用特殊性(--------有问题--------)

© 著作权归作者所有

共有 人打赏支持
Q_z

Q_z

粉丝 18
博文 17
码字总数 14466
作品 0
成都
程序员
knockout2.0系列教程汇总

本文档对knockout2.x的基本使用方法做了讲解,虽然不是十分全面,但也几乎涵盖了knockout2.x的知识(除了高级用法、自定义绑定) 高级应用 分享到:

zuolz1985
2013/05/11
0
0
哪里可以找到 Kali Linux 的教程?

Kali Linux 秘籍 原书:Kali Linux Cookbook 译者:飞龙 在线阅读 PDF格式 EPUB格式 MOBI格式 Github Git@OSC 目录: 第一章 安装和启动Kali 第二章 定制 Kali Linux 第三章 高级测试环境 第...

wizardforcel0
07/02
0
0
总有你要的编程书单(GitHub )

目录 IDE IntelliJ IDEA 简体中文专题教程 MySQL 21分钟MySQL入门教程 MySQL索引背后的数据结构及算法原理 NoSQL Disque 使用教程 Neo4j .rb 中文資源 Redis 命令参考 Redis 设计与实现 The ...

汇智网
2017/11/22
0
0
free-programming-books-zh.md

语言无关MySQL NoSQL PostgreSQL Web WEB服务器 其它 函数式概念 分布式系统 在线教育 大数据 操作系统 数据库 智能系统 正则表达式 版本控制 程序员杂谈 管理和监控 编程艺术 编译原理 编辑...

银月光海
2016/05/20
70
0
免费的编程中文书籍索引

免费的编程中文书籍索引,欢迎投稿。 国外程序员在 stackoverflow 推荐的程序员必读书籍,中文版。 stackoverflow 上的程序员应该阅读的非编程类书籍有哪些? 中文版 github 上的一个流行的编...

modernizr
2014/04/08
6.9K
24
免费的计算机编程类中文书籍

免费的编程中文书籍索引,欢迎投稿。 国外程序员在 stackoverflow 推荐的程序员必读书籍,中文版。 stackoverflow 上的程序员应该阅读的非编程类书籍有哪些? 中文版 github 上的一个流行的编...

justjavac
2014/08/13
2.6K
10
JavaScript面向对象的编程指南学习笔记

JavaScript面向对象的编程指南学习笔记 第一章 1,用自己的语言描述出,什么是对象、类、封装、聚合、继承、多态? 第二章 1,在控制台输入表达式后,返回undefined原因: 2, css 中颜色表示的...

优惠券发放
05/18
0
0
物联网应用协议学习笔记 2.2.1 阿里云IoT平台接入 开发准备

这篇笔记涉及 阿里云CoAP接入,其他物联网应用协议学习笔记可点此查看。 1 开通物联网套件 本节内容主要来自于阿里云官网,阿里云物联网套件 > 快速开始 > 高级版快速开始 > 开发准备。 开通...

iotisan
04/23
0
0
编程类开放书籍荟萃(转载)

关于开源图书有人在网络上做了大量整理,本文为大家刊载《免费的编程中文书籍索引》 国外程序员在 stackoverflow 推荐的程序员必读书籍,中文版。 stackoverflow 上的程序员应该阅读的非编程...

行者PHPer
2016/10/09
77
0
免费的编程中文书籍索引【收藏速度】

语言无关类 优质博客 PyTab在线手册中心 ImportNew 廖雪峰的官方网站 程序员博客墙 操作系统 开源世界旅行手册 鸟哥的Linux私房菜 Linux 系统高级编程 The Linux Command Line (中英文版) L...

yonghu86
2015/04/15
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

虚拟机怎么安装vmware tools

https://blog.csdn.net/tjcwt2011/article/details/72638977

AndyZhouX
9分钟前
0
0
There is no session with id[xxx]

参考网页 https://blog.csdn.net/caimengyuan/article/details/52526765 报错 2018-07-19 23:04:35,330 [http-nio-1008-exec-8] DEBUG [org.apache.shiro.web.servlet.SimpleCookie] - Found......

karma123
9分钟前
0
0
vue-router懒加载

1. vue-router懒加载定义 当路由被访问的时候才加载对应组件 2. vue-router懒加载作用 当构建的项目比较大的时候,懒加载可以分割代码块,提高页面的初始加载效率。 ###3. vue-router懒加载实...

不负好时光
16分钟前
0
0
庆祝法国队夺冠:用Python放一场烟花秀

天天敲代码的朋友,有没有想过代码也可以变得很酷炫又浪漫?今天就教大家用Python模拟出绽放的烟花庆祝昨晚法国队夺冠,工作之余也可以随时让程序为自己放一场烟花秀。 这个有趣的小项目并不...

猫咪编程
18分钟前
0
0
SpringBoot | 第七章:过滤器、监听器、拦截器

前言 在实际开发过程中,经常会碰见一些比如系统启动初始化信息、统计在线人数、在线用户数、过滤敏高词汇、访问权限控制(URL级别)等业务需求。这些对于业务来说一般上是无关的,业务方是无需...

oKong
32分钟前
4
0
存储结构分四类:顺序存储、链接存储、索引存储 和 散列存储

存储结构分四类:顺序存储、链接存储、索引存储 和 散列存储 存储结构分四类:顺序存储、链接存储、索引存储 和 散列存储。 顺序结构和链接结构适用在内存结构中。 顺序表每个单元都是按物理...

DannyCoder
42分钟前
1
0
Firefox 61已经为Ubuntu 提供支持

最新和最好的Mozilla Firefox 61 “Quantum”网络浏览器已经为Ubuntu Linux操作系统的用户提供了支持,现在可以通过官方软件库进行更新。 Mozilla于2018年6月26日发布了Firefox 61版本,该版...

六库科技
今天
0
0
Win10升级后执行系统封装(Sysprep)报错

开始封装 一年多以前开始给公司封装Win10系统,便于统一给公司电脑初始化携带各种软件的系统,致力于装完既可以开发的状态。那时候最新的版本是Win10 1703版本,自然就以他为母盘,然后结合V...

lyunweb
今天
40
0
php 性能优化

#什么情况下会遇到性能问题 PHP 语法使用的不恰当

to_be_better
今天
0
0
Jenkins 构建触发器操作详解

前言 跑自动化用例每次用手工点击jenkins出发自动化用例太麻烦了,我们希望能每天固定时间跑,这样就不用管了,坐等收测试报告结果就行。 一、定时构建语法 * * * * * (五颗星,中间用空格隔...

覃光林
今天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部