CSS视频 46-64
来源:互联网 发布:国外网络电视台直播 编辑:程序博客网 时间:2024/05/22 01:35
46-文本样式
text-decoration: underline
text-decoration: overline;
注:两者同时存在执行后一条,text-decoration: underlineoverline;全部执行,没有顺序
text-transform:文本的变形,大小写
注:超链接下划线自带,用text-transform:none
字符间距
word-spacing
letter-spacing
文本对齐方式
text-align:justify两端对齐
首行缩进
text-indent:2em 正负值
47-盒子模型
分为:内边距、内容区、边框、外边距
盒子样式练习:
练习:边框左右上为20px,下为30px
练习:左右上有边框,下无边框
50-内边距
padding: 20px
51-外边距
margin-left: auto;
margin-right: auto;
显示:左右相同
水平设置哪个auto就是最大
垂直为0
53-浏览器默认样式
正常情况下不用。编写之前去除
*{
margin:0;
padding:0;
}
54-内联元素的盒模型
注:
1、不可设置宽和高
2、内联元素可以设置水平、垂直方向的内边距,垂直内边距不会产生
3、内联元素可设置边框
4、外边距只支持水平
55-overflow
子元素超过父元素会在以外显示,溢出
Overflow:处理溢出的内容
56、57-文档流
58、59-浮动
float: right;
注:
1、 不会超过块元素,父元素
2、 浮动元素会环绕周围,不会被覆盖
3、 块元素脱离文档流之后内容都被撑开
60-简单布局
练习:设置简单的页面
61、62-高度塌陷
BFC:默认关闭。
开启后:
1、 父元素垂直外边距不会和子元素重叠
2、 开启后的不会被浮动元素覆盖
3、 父元素可以包含浮动的子元素
如何开启:
1、 设置元素浮动
2、 元素绝对定位
3、 Inline-block
4、 将元素的overflow设置为非visible的值 注:IE6中的has layout和overflow类似,zoom设置为1即可
注:最好两种都写
63-导航条的练习
重点:首页、新闻、联系、关于
64-解决高度塌陷的最终方案(不熟悉)
二、塌陷的父元素后直接加一个空白的div,然后进行清除浮动
注:会有多余的结构
三、通过after伪类向元素的最后添加一个空白的块元素,然后清除。
.box:after{
Display:block;
Clear:both;
}
注:IE6中
clear-fix:{
Zoom:1;
}
- CSS视频 46-64
- div+css 视频
- css布局视频
- css视频笔记整理
- 燕十八视频--CSS
- CSS视频33-45
- CSS介绍及视频分享
- CSS选择器 视频24-27
- CSS视频 选择器 27-32
- html+css视频 89-91
- 分享几个DIV+CSS视频资源
- 共享视频 - XPage JavaScript/CSS 聚合功能
- 《research-css-视频教学》教学笔记
- css的基础知识的学习视频网站
- CSS+DIV+JQuery实战视频总结
- html+(DIV+CSS)+javascript视频笔记(全)
- CSS 3 Flex 全解【视频】
- html&css------添加视频(11/2)
- 人脸识别
- iOS——WebViewJavascriptBridge实现OC与JS交互
- 查看Linux磁盘及内存占用情况
- [整理]在Spring MVC中使用Quartz实现定时任务动态管理
- 访问者模式
- CSS视频 46-64
- C#开发Windows窗体应用程序的步骤
- Mysql查询结果顺序按 in() 中ID 的顺序排列
- 在Activiti中如何使用自定义的组织架构
- C
- 安卓中margi、algin、padding区别(图解)
- mysql分布式数据库中间件对比
- GDI+学习及代码总结之------画线、区域填充、写字
- 清晰理解 Android Service