Head Html Css 第二版笔记
一、 引用
<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 第二版笔记的更多相关文章
- python核心编程第二版笔记
python核心编程第二版笔记由网友提供:open168 python核心编程--笔记(很详细,建议收藏) 解释器options:1.1 –d 提供调试输出1.2 –O 生成优化的字节码(生成 ...
- C++标准库第二版笔记 3 和异常的理解 1
C++标准库第二版笔记 3 和异常的理解 1 差错和异常(error and exception)的处理 标准异常类(exception class) 定义于 分为: 1.语言本身支持的异常 2.标准 ...
- C++标准库第二版笔记 2.1
C++标准库第二版笔记 2.1 1 Range-Based for 循环 for ( decl : coll ) { statements; } // collaborate 类似C# foreach ...
- C++标准库第二版笔记 2
C++标准库第二版笔记 2 微小但重要的语法提升 template表达式内的空格: vector< list<int> >; // OK in each C++ version ...
- C++标准库第二版笔记 1
C++标准库第二版笔记 1 C++ std历史 第一份标准化文档: C++98 & C++03 & TR1 TR1 Information Technology- Programmin ...
- 精通JavaScipt第二版笔记——特性、函数和对象
前言:感觉这本书只有第二章 第三章有点看头 基本类型和引用类型 基本类型:字符串 数字 布尔值 null(待确定) undifined 引用类型:对象 数组 引用传递 保存的只是对象的地址 var o ...
- 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 ...
- JavaPersistenceWithHibernate第二版笔记-第六章-Mapping inheritance-002Table per concrete class with implicit polymorphism(@MappedSuperclass、@AttributeOverride)
一.结构 二.代码 1. package org.jpwh.model.inheritance.mappedsuperclass; import javax.persistence.MappedSup ...
- JavaPersistenceWithHibernate第二版笔记-第六章-Mapping inheritance-001Hibernate映射继承的方法
There are four different strategies for representing an inheritance hierarchy: Use one table per co ...
随机推荐
- NYOJ-476谁是英雄,分解质因子求约数个数!
谁是英雄 时间限制:1000 ms | 内存限制:65535 KB 难度:3 描述 十个数学家(编号0-9)乘气球飞行在太平洋上空.当横越赤道时,他们决定庆祝一下这一壮举.于是他们开了一瓶香槟.不 ...
- [HDU1576] A/B(扩展欧几里得)
传送门 n = A % 9973 -> n = A - A / 9973 * 9973 设 x = A / B(题目所述,B|A) -> A = B * x 所以 B * x - A / ...
- Oracle中,利用sql语句中的函数实现保留两位小数和四舍五入保留两位小数
Oracle中,利用sql语句中的函数实现保留两位小数和四舍五入保留两位小数: select trunc(1.23856789,2) from dual round(m,n) 可以四舍五入 trunc ...
- 更新数据库中数据时出现: Error Code: 1175. You are using safe update mode and you tried to update a table without a WHERE that uses a KEY column To disable safe mode, toggle the option in Preferences 问题
使用workbench在数据库中更新数据时报错: You are using safe update mode and you tried to update a table without a WH ...
- Ubuntu 16.04安装Redis
版本:4.0.2 下载地址:https://redis.io/download 离线版本:(链接: https://pan.baidu.com/s/1bpwDtOr 密码: 4cxk) 安装过程: 源 ...
- Vue中删除重复上传的文件
上传控件: <el-upload class="upload-demo" :on-change="filesChange"> filesChang ...
- 基于cocos2d-x-3.2学习Box2D(一)
cocos版本号:cocos2d-x-3.2 环境:Win7+VS2013 因为一些太底层的实现我如今的能力学习不到,仅仅能做一些简单的笔记,供以后翻阅.假设别人可以得到帮助,莫大的荣幸. 一.创建世 ...
- CSS Modules 解决 react 项目 css 样式互相影响的问题
1. CSS Modules引入目的 写过CSS的人,应该都对一大长串选择器选中一个元素不陌生吧,这种方式,其实定义的就是全局样式,我们时常会因为选择器权重问题,没有把我们想要的样式加上去. 另外,每 ...
- openstack (1)----- NTP 时间同步服务
一.标准时间 1.地球分为东西十二个区域,共计24个时区 2.格林威治作为全球标准时间即(GMT时间),东时区以格林威治时区进行加,而西时区则进行减 3.地球的轨道并非正圆,在加上自传速度逐年递减,因 ...
- chosen.jquery.js 搜索框只能从头匹配的解决思路+方法
chosen.jquery.js 搜索框只能从头匹配的解决思路+方法 心急者请直接看下方 总结 ,由于本问题未能找到直接答案,所以只能通过修改源码解决.故将修改源码思路贴出来供大家参考,在遇到其他改源 ...