一、 引用

<q>I like</q> 简短地“引用”文字中的一部分,而  <blockquote>ago aog aogag </blockquote> 则是引用一大段文字并独立显示

二、 <a>

创建目的地

 <h2><a id="chai">Chai Tea</a></h2>//创建了一个目标锚
<a href="index.html#chai">See Chai Tea</a>//链接到的位置

使用id属性在页面中创建目标锚,在“#”后面跟目标锚id,用以链接到页面的特定位置。

使用target打开一个新窗口

 <a target="_blank" href="http://buzz.headfirsttlabs.com" title="ew">Caffeine Buzz</a>

三、 文本下划线

text-decoration:underline

四、 链接到外部样式表

<link rel="stylesheet" type="text/css" href="lounge.css"/>

五、 font-family工作原理

body{ font-family: Verdana, Geneva, Arial; }

g按照顺序在浏览器中找,如果第一种字体没有,就显示第二种,依次类推。

六、 字体大小

 font-size: 15px;
font-size:150%;
font-size: 1.2em//表明字体大小应该按比例放大1.2倍

七、 边框

border-width 边框宽度

border-style 边框样式:实线、虚线等

border-color 边框颜色

八、 元素的宽度

如果我们不设置元素的宽度,那么就会默认“auto”,使内容充满所有空间。

而且我们不能定义整个元素的宽度,只能定义内容区、补白、边框和边界的宽度,把这些加起来就是整个元素的宽度。

九、 text-align

text-align设置文本居中对齐,text-align属性会影响到一个元素中所有内联内容的对齐样式,使其中所有内容都居中,并且text-align只用于块元素,如果直接作用于内联元素是没用的。

例子:如果一个div中包含了img,在对这个div使用text-align时,图像也会居中

十、 line-height

可以用来确定行间距

十一、 浏览器放置元素

当浏览器并排放置两个内联元素时,如果左边元素有10像素的边界,右边的有20像素的边界,则两个元素之间就会有30像素的空间。

当浏览器并列放置两个块元素时,就会把共同的边界重叠到一起,重叠边界的高度是最大边界的值

十二、 漂移属性float

对于float属性必须先给元素设置一个宽度

clear属性,就是使元素流入页面时,不允许漂移元素出现在这个元素周边;

如clear:right;就会使这个元素右边不能出现漂移元素

十三、 绝对布置

position:absolute;

且流元素忽视绝对布置元素的存在,也就是clear不再起作用

十四、 固定布置

使用固定布置后,元素就会呆在你放置的地方,再也不动。

position:fixed

十五、 表格

如果把表头放在表格的左边而不是上边,则需要将表格表头元素分别放入每行来代替原先的第一行。把每个<th>元素放在每行的开头,那么所有的表头放在第一行。

border-collapse:collapse; 可以将两个相邻的边框合并为一个边框

border-spacing:mpx;设置边框间距

vertical-align:top/bottom/center;表格中垂直的排列方式

十六、 列表

1、 list-style-type:disc/circle/square/none; 设置列表前面的样式

2、 list-style-position:inside/outside; 如果属性设置为inside,则文本就会环绕在标记的下面,设置为outside,那么标记就会环绕在文本的下面。

十七、 表单

1、 输入单选框

2、 输入复选框

3、 maxlength属性可以限制用户最多输入的字符数。

4、 表单中的每个输入控件都有一个那么属性,即都有一个唯一的名字,当我们单击提交按钮时,浏览器会将提取的所有名字连同他们的名字一起发给服务器。例如,当你将邮编“90050”输入到名为“zip”的<input>的文本元素时,提交表单后浏览器会发送“zip=90050”给服务器。

注意:<option>元素没有name属性,因为全部的option元素都是由<select>元素创建的,只要一个名字命名就可。

5、 POST和GET

两者都是把表单数据发送给服务器,但是POST,是把表单变量打包后隐藏在后台发送给服务器,GET也是把表单变量打包后,不过在它向浏览器发送请求之前,附加在URL的末端部分。

即POST发送的用户不可见,而GET发送的用户可见。

6、 Fieldsets和legends

7、label标签

8、 文件输入

<input type="file" name="doc"/>

9、 多选属性 multiple

十八、 伪元素选择符

 p:first-letter{
font-size:3em;
}//:first-letter伪元素选择符可用于选择一个块元素的第一个字,允许你设置首字大写和首字下沉。
p:first-line{
font-style:italic;
}//:first-line用于选择某一段的第一行文字。

十九、 属性选择符

二十、 组合选择符

Head Html Css 第二版笔记的更多相关文章

  1. python核心编程第二版笔记

    python核心编程第二版笔记由网友提供:open168 python核心编程--笔记(很详细,建议收藏) 解释器options:1.1 –d   提供调试输出1.2 –O   生成优化的字节码(生成 ...

  2. C++标准库第二版笔记 3 和异常的理解 1

    C++标准库第二版笔记 3 和异常的理解 1 差错和异常(error and exception)的处理 标准异常类(exception class) 定义于 分为: 1.语言本身支持的异常 2.标准 ...

  3. C++标准库第二版笔记 2.1

    C++标准库第二版笔记 2.1 1 Range-Based for 循环 for ( decl : coll ) { statements; } // collaborate 类似C# foreach ...

  4. C++标准库第二版笔记 2

    C++标准库第二版笔记 2 微小但重要的语法提升 template表达式内的空格: vector< list<int> >; // OK in each C++ version ...

  5. C++标准库第二版笔记 1

    C++标准库第二版笔记 1 C++ std历史 第一份标准化文档: C++98 & C++03 & TR1 TR1 Information Technology- Programmin ...

  6. 精通JavaScipt第二版笔记——特性、函数和对象

    前言:感觉这本书只有第二章 第三章有点看头 基本类型和引用类型 基本类型:字符串 数字 布尔值 null(待确定) undifined 引用类型:对象 数组 引用传递 保存的只是对象的地址 var o ...

  7. JavaPersistenceWithHibernate第二版笔记-第六章-Mapping inheritance-003Table per concrete class with unions(@Inheritance(strategy = InheritanceType.TABLE_PER_CLASS)、<union-subclass>)

    一.代码 1. package org.jpwh.model.inheritance.tableperclass; import org.jpwh.model.Constants; import ja ...

  8. JavaPersistenceWithHibernate第二版笔记-第六章-Mapping inheritance-002Table per concrete class with implicit polymorphism(@MappedSuperclass、@AttributeOverride)

    一.结构 二.代码 1. package org.jpwh.model.inheritance.mappedsuperclass; import javax.persistence.MappedSup ...

  9. JavaPersistenceWithHibernate第二版笔记-第六章-Mapping inheritance-001Hibernate映射继承的方法

    There are four different strategies for representing an inheritance hierarchy: Use one table per co ...

随机推荐

  1. C语言学习<输入输出函数,函数的调用>

    #include <stdio.h> /* 输入输出函数的学习 函数的调用 2017.05.25 soulsjie */ //输入连个数字求最大值 void main(){ int Max ...

  2. Reactor Cooling(无源汇有上下界网络流)

    194. Reactor Cooling time limit per test: 0.5 sec. memory limit per test: 65536 KB input: standard o ...

  3. [bzoj4827][Hnoi2017]礼物_FFT

    礼物 bzoj-4827 Hnoi-2017 题目大意:给定两个长度为$n$的手环,第一个手环上的$n$个权值为$x_i$,第二个为$y_i$.现在我可以同时将所有的$x_i$同时加上自然数$c$.我 ...

  4. Redundant Paths-POJ3177(强连通缩点)

    http://poj.org/problem?id=3177 题目大意:给你几个点和几条边   求你能加几条边  就可以让每一个点到达任意点都有两种方法. Description In order t ...

  5. Mutual Training for Wannafly Union #9

    A(SPOJ NPC2016A) 题意:给一个正方形和内部一个点,要求从这个点向四边反射形成的路线的长度 分析:不断做对称,最后等价于求两个点之间的距离 B(CF480E) 题意:求01矩阵内由0组成 ...

  6. 输入一个URL之后。。。

    1.输入URL2.浏览器去浏览器缓存.系统缓存.路由器缓存查找缓存记录,有则直接访问URL对应的IP,无则下一步3.DNS解析URL,获得对应的IP4.浏览器通过TCP/IP三次握手连接服务器5.客户 ...

  7. Ubuntu 16.04安装Ubuntu After Install工具实现常用软件批量安装

    这个软件集成了常用且好用的软件,且只需要选择需要的软件之后自动安装好,不需要额外设置. 安装: sudo add-apt-repository ppa:thefanclub/ubuntu-after- ...

  8. Oracle建表提示SQL 错误: ORA-00904: : 标识符无效

    Oracle建表提示: 错误报告:SQL 错误: ORA-00904: : 标识符无效00904. 00000 -  "%s: invalid identifier"*Cause: ...

  9. Java实现二叉搜索树及相关操作

    package com.tree; import com.tree.BitNode; /** * * 二叉搜索树:一个节点的左子节点的关键字小于这个节点.右子节点的关键字大于或等于这个父节点 * * ...

  10. BNU 25593 Prime Time 记忆化dp

    题目链接:点击打开链接 题意: 一个游戏由3个人轮流玩 每局游戏由当中一名玩家选择一个数字作为開始 目的:获得最小的得分 对于当前玩家 O .面对 u 这个数字 则他的操作有: 1. 计分 u +1 ...