CSS 设计指南(第3版) 初读笔记

html标记内容,css显示内容. html标记由一系列标签组成,包括闭合标签和自闭合标签,属性给标签提供了额外信息.标签可以嵌套. 标签分为块级别和行内级别,块级标签占一行(扩展到与父元素同宽),行内标签则相反,只有在空间不足才会折到下一行. html实体表示键盘上没有印刷的字符,它以&开始,;结束. dom层次可以使用父标签(直接祖先),子标签(直接后代),同胞标签,后代.祖先标签来表示. html标签都有一组样式,通过css来设定.css选择符和要应用的样式构成了一条css规则. css行

<css设计指南>这本书是一个大神同学介绍给我的,据说覆盖了几乎所有前端面试的有关css的知识点,所以赶紧买来看看.( ps:这本书貌似绝版了,可以上淘宝买复印本,也可直接看电子书. ) 闭合标签,自闭合标签. html5中,将忽略所有自闭合标签最后的 / .可是建议在最后仍然加上  空格加/ 以规范格式. 所有img标签都需要加上alt属性. ps:视障用户使用的屏幕阅读器会读出图片的alt属性. 行内.块级标签.  块级: h1~h6, p, ol/ul, li, blockquote .

通过阅读和学习书籍<CSS设计指南>总结 <CSS设计指南>/Charles lvyke-Smith著.李松峰译-人民邮电出版社 本书网站:http://www.stylinwithcss.com 强烈推荐!!深入浅出,精简,适合入门!! HTML标记与文档结构 1.1 HTML标记基础 1.1.1 文本用闭合标签 ??闭合标签的基本格式如下: <标签名>文本内容<标签名/> <标签名 属性_1="属性值" 属性_2="属

原文:CSS设计指南之理解盒子模型 一.理解盒模型 每一个元素都会在页面上生成一个盒子.因此,HTML页面实际上是由一堆盒子组成的.默认情况下,每个盒子的边框不可见,背景也是透明的,所以我们不能直接看到页面中盒子的结构.使用WebDeveloper工具条中的"OutLine"->"OutLine Level Element"菜单项,可以方便地显示盒子的边框和背景,从而让我们能从另外一个角度来审视页面的构成. 1.1 元素盒子的属性 1.边框(border):可

原文:CSS设计指南之浮动与清除 浮动意思就是把元素从常规文档流中拿出来,浮动元素脱离了常规文档流之后,原来紧跟在其后的元素就会在空间允许的情况下,向上提升到与浮动元素平起平坐. 一.浮动 CSS设计float属性的主要目的,是为了实现文本绕排图片的效果.然而,这个属性也成为了创建多栏布局最简单的方式. 1.文本绕排图片 在浮动一张图片或其他元素时,你是在要求浏览器把它往上方推,直到它碰到父元素的内边界.后面的段落不再认为浮动元素在文档流中位于它的前面了,因为它会占据父元素左上角的位置.不过,它

通过阅读和学习书籍<CSS设计指南>总结 <CSS设计指南>/Charles lvyke-Smith著.李松峰译-人民邮电出版社 本书网站:http://www.stylinwithcss.com 强烈推荐!!深入浅出,精简,适合入门!! CSS工作原理 2.1 剖析CSS规则 ??规则实际上就是一条完整的CSS指令.规则声明了要修改的元素和要应用给该元素的样式. 2.1.1 为文档添加样式的三种方法 ??有三种方法可以把CSS添加到网页中,分别是写在元素标签里(行内样式),写在&

颜色值 指定颜色值可以有几种方式.这些方式可以在同一个样式表中混合使用. 1.颜色名(如red) 设定颜色属性时可以直接使用颜色名,或者用官方术语就是颜色关键字.  W3C定义了16个颜色关键字:aqua(浅绿色).black(黑色).blue(蓝色).fuchsia(紫红色).gray(灰色).green(绿色).lime(黄绿色).maroon(褐红色).navy(深蓝色).olive(茶青色 ).purple(紫色).red(红色).silver(银色).teal(青色).white(白色

当然我只是记录一下我初读这本书的想法和我自己不懂该记下的地方,其他的地方就不一一论述,全部记下来就没有意思了. 若有什么错误,望大家指出,谢谢~希望有评论~ ------------------------------------------------------------------ 前言就是明确的介绍书的目的编程标准等等..source code在http://man7.org/大家可以去参阅 一章介绍POSIX标准和一些历史发展. 二章开始介绍基本概念: 讲到了内核的功能:1.提供了文

2.1 常用的选择器 1. 类型选择器  p { color: black; } 2. 后代选择器  blockquote p { padding-left: 2em; } 3. ID选择器  #intro { font-weight: bold; } 4. 类选择器  .date-posted { color: #cccccc; } 5. 伪类  a:link { color: blue; } 6. 通用选择器  * { padding: 0; } 7. 子选择器  #nav>li { pad