12.8学习日记

---

复习

需要转义的字符

一、文本元素总汇

元素名称	说明
a	生成超链接
br	强制换行
wbr	可安全换行
b	标记一段文字但不强调
strong	表示重要
i	表示外文或科学术语
em	表示强制
code	表示计算机代码
samp	表示变量
kdb	用户输入
abbr	表示缩写
cite	其他作品的标题
del	删除的文字
dfn	术语定义
mark	与另一段上下文有关的内容
q	引自他处
bdo	文字方向
small	小号字体
sub	下标文字
sup	上标文字
time	时间或日期
u	下划线
span	没有任何语义，一般配合css
pre	保留文本格式

HTML参考手册

HTML5 中新的语义元素
许多网站包含了指示导航、页眉以及页脚的 HTML 代码，例如这些：

。
HTML5 提供了定义页面不同部分的新语义元素：

标签	描述
	定义文章
	定义页面内容以外的内容
	定义用户能够查看或隐藏的额外细节
	定义 元素的标题
	规定自包含内容，比如图示、图表、照片、代码清单等
	定义文档或节的页脚
	规定文档或节的页眉
	规定文档的主内容
	定义重要的或强调的文本
	定义导航链接
	定义文档中的节
	定义 元素的可见标题
	定义日期/时间

• 你也可以使用 CSS 把图片嵌入网站中（JavaScript也行，不过那是另外一个故事了），这个 CSS 属性 background-image 和另其他 background-* 属性是用来放置背景图片的。比如，为页面中的所有段落设置一个背景图片，你可以这样做：

p {
  background-image: url("images/dinosaur.jpg");
}

• 按理说，这种做法相对于 HTML 中插入图片的做法，可以更好地控制图片和设置图片的位置，那么为什么我们还要使用 HTML 图片呢？如上所述，CSS 背景图片只是为了装饰 — 如果你只是想要在你的页面上添加一些漂亮的东西，来提升视觉效果，那 CSS 的做法是可以的。但是这样插入的图片完全没有语义上的意义，它们不能有任何备选文本，也不能被屏幕阅读器识别。这就是 HTML 图片有用的地方了。

• video

• audio

audio不支持wdith和length属性

• WebVTT 是一个格式，用来编写文本文件，这个文本文件包含了众多的字符串，这些字符串会带有一些元数据，它们可以用来描述这个字符串将会在视频中显示的时间，甚至可以用来描述这些字符串的样式以及定位信息。这些字符串叫做 cues ，你可以根据不同的需求来显示不同的样式，最常见的如下：
• subtitle通过添加翻译字幕，来帮助那些听不懂外国语言的人们理解音频当中的内容。
• captions同步翻译对白，或是描述一些有重要信息的声音，来帮助那些不能听音频的人们理解音频中的内容。
• timed descriptions将文字转换为音频，用于服务那些有视觉障碍的人。

---

响应式图片

---

1. 命名规范
   驼峰式命名法介绍：
   驼峰式命名法由小(大)写字母开始，后续每个单词首字母都大写。

按照第一个字母是否大写，分为：

① Pascal Case 大驼峰式命名法：首字母大写。eg：StudentInfo、UserInfo、ProductInfo

② Camel Case 小驼峰式命名法：首字母小写。eg：studentInfo、userInfo、productInfo

1.1 变量

命名方法：小驼峰式命名法。

命名规范：前缀应当是名词。(函数的名字前缀为动词，以此区分变量和函数)

命名建议：尽量在变量名字中体现所属类型，如:length、count等表示数字类型；而包含name、title表示为字符串类型。

示例：

// 是否可阅读
function canRead() {
    return true;
}
 
// 获取名称
function getName() {
    return this.name;
}

1.3 常量

命名方法：名称全部大写。

命名规范：使用大写字母和下划线来组合命名，下划线用以分割单词。

命名建议：无。

示例：

var MAX_COUNT = 10;
var URL = 'http://www.baidu.com';

1.4 构造函数

介绍：在JS中，构造函数也属于函数的一种，只不过采用new 运算符创建对象。

命名方法：大驼峰式命名法，首字母大写。

命名规范：前缀为名称。

命名建议：无。

示例：

function Student(name) {
    this.name = name;
}
 
var st = new Student('tom');

1.5 类的成员

类的成员包含：

① 公共属性和方法：跟变量和函数的命名一样。

② 私有属性和方法：前缀为_(下划线)，后面跟公共属性和方法一样的命名方式。

示例：

function Student(name) {
    var _name = name; // 私有成员
 
    // 公共方法
    this.getName = function () {
        return _name;
    }
 
    // 公共方式
    this.setName = function (value) {
        _name = value;
    }
}
var st = new Student('tom');
st.setName('jerry');
console.log(st.getName()); // => jerry：输出_name私有变量的值

---

svg教程

css属性选择器

派生选择器中的：> + " "

---

body
  { 
    background-image:url('/i/eg_bg_03.gif');
    background-repeat:no-repeat;//repeat-x repeat-y
    background-position:center;//默认值center center
    background-attachment:fixed;//默认值scoll
  }

css背景属性

css背景图片w3c

---

不过在为 text-indent 设置负值时要当心，如果对一个段落设置了负值，那么首行的某些文本可能会超出浏览器窗口的左边界。为了避免出现这种显示问题，建议针对负缩进再设置一个外边距或一些内边距：

p {text-indent: -5em; padding-left: 5em;}

text-indent 属性可以继承
text-align:center right left justify
word-spacing
letter-spacing
text-transform:uppercase lowercase capitalize none
text-decoration:underline overline line-through blink
white-space:nomal pre pre-wrap nowarp pre-line
line-height:

css文本属性

---

除了各种特定的字体系列外，CSS 定义了 5 种通用字体系列：
Serif 字体
Sans-serif 字体
Monospace 字体
Cursive 字体
Fantasy 字体

css字体w3c

css字体属性

---

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
a:active {text-decoration:underline;}

a:hover 必须位于 a:link a:visted之后
a:active 必须位于a:hover之后

---

css列表属性

css表格属性

css轮廓

轮廓实例

css定位属性

css属性选择器

css伪类

注释："first-letter" 伪元素只能用于块级元素。
注释：下面的属性可应用于 "first-letter" 伪元素：
font
color
background
margin
padding
border
text-decoration
vertical-align (仅当 float 为 none 时)
text-transform
line-height
float
clear

cssfirstline伪元素

css分类属性