北大青鸟培训第二周第二天：HTML和CSS相关知识 （持续更新）
目录
行间距
1.行高 （line height）:文字占有的实际高度
2.单行文本在父元素中垂直居中
3.font 中也可以指定行高 font:bold italic 25px/3 serif;
文本样式
1:text-transform 可以用来设置文本的大小写
2.text-decoration 可以用来设置文本的修饰
3.letter-spacing 可以指定字符间距
4. word-spacing 可以设置单词之间的距离
5. text-align 用于设置文本的对齐方式
6. text- align:center 设置首行缩进常用单位是em单位
7. white-space:;设置网页如何处理空白
8.tect-overflow 文本溢出包含元素时发生的事情
10.text-shadow: h-shadow v-shadow blur color;
11.box-shoadow: h-shadow v-shadow blur color;
9.vertical-align 设置元素垂直对齐的方式
方案一
方案二
方案三
方案四
文档流
块元素
内联元素（行内元素）
元素脱离文档流后的特点
行间距
1.行高 （line height）:文字占有的实际高度
行高=上间距+字体大小+下间距
默认情况：上间距=下间距= （行高-字体大小）/2
行间距=下间距+上间距=行高-字体大小
line-height 属性（1）直接放一个大小的单位 xxpx xxem xxrem
（2）直接放倍数 例如 ：1，2，3是当前字体大小的倍数
（3）放百分比是当前字体大小的百分比
2.单行文本在父元素中垂直居中
3.font 中也可以指定行高 font:bold italic 25px/3 serif;
文本样式
1:text-transform 可以用来设置文本的大小写
none 默认值 文本正常显示uppercase 文本大写lowercase 文本小写capitalize 首字母大写2.text-decoration 可以用来设置文本的修饰
none 默认值 文本正常显示
underline 下划线
overline 上划线
line-through 删除线
3.letter-spacing 可以指定字符间距
4. word-spacing 可以设置单词之间的距离
5. text-align 用于设置文本的对齐方式
left 文本向左 默认值
right 文本向右
center 居中显示
justify 两端对齐
6. text- align:center 设置首行缩进常用单位是em单位
7. white-space:;设置网页如何处理空白
8.tect-overflow 文本溢出包含元素时发生的事情
/* 先设置固定宽度 */width: 300px;/* 设置不换行 */white-space: nowrap;/* 设置省略号 */text-overflow: ellipsis;/* 裁剪多余的/溢出的内容 */overflow: hidden;
10.text-shadow: h-shadow v-shadow blur color;
参数
第一个参数：阴影的水平距离 （必填）正值向右，负值向左
第二个参数： 阴影的垂直位移距离 （必填） 正值向下，负值向上
第三个参数： 阴影的模糊半径
第四个参数： 阴影的颜色（默认是字体颜色）
11.box-shoadow: h-shadow v-shadow blur color;
参数：
第一个参数：阴影的水平位移距离 （必填） 正值向右，负值向左
第一个参数：阴影的垂直位移距离 （必填） 正值向下，负值向上
第三个参数：阴影的模糊半径
第四个参数：阴影的颜色 （默认是黑色）
9.vertical-align 设置元素垂直对齐的方式
baseline 基线对齐 沿着字母x最下方对齐top bottom middle1.设置元素垂直对齐的方式，这种功能，只针对图片，文字，表格，不针对块元素
2.解决图片三像素的问题（面试题）
方案一
vertical-align 样式，设置一个非baseline的样式值
方案二
设置父元素的font-size 为0
方案三
将图片转成块元素
方案四
将元素脱离文档流
文档流
网页是一个多层的结构，设置样式，也是一层一层的设置，最终我们看到的是最上面的一层
文档流是网页的最底层
我们创建的元素默认情况下，都在文档流中
元素分为两种状态：在文档流中，脱离文档流
元素在文档流中的特点
块元素
1:会独占一行
2:块元素的宽度默认是父元素的100%
3:块元素的高度默认是被内容撑开的
内联元素（行内元素）
1:不会独占一行
2:宽度高度默认都是被内容撑开的，不能自己定义宽高
行内块元素
元素脱离文档流后的特点
元素脱离文档流之后，就不再区分块元素，行内元素，行内块元素，
也就是块元素不会独占一行，行内也可以设置宽高，三像素问题也没有
元素怎么脱离文档流
浮动 绝对定位 flex 等等
北大青鸟培训第二周第二天：HTML和CSS相关知识 （持续更新）相关推荐
- 北大青鸟培训第三天：HTML和CSS相关知识 （持续更新）
音视频 audio src controls loop autoplay audio标签 用来向页面中引入一个外部的音频文件 src 指向音频的引入路径 controls 控制是否允许用户点击播放,默 ...
- 北大青鸟培训第四天：HTML和CSS相关知识 （持续更新）
目录 属性选择器 伪类选择器 元素的伪类 属性选择器 1.[属性名]{} 2. [属性名=属性值]{} 3.[属性名^=属性值]{} 4. [属性名$=属性值]{} 5.[属性名*=属性值]{} 1. ...
- 北大青鸟培训第五天：HTML和CSS相关知识 （持续更新）
继承:继承是一种规则,它允许样式不仅应用于某个特定html标签元素,还可应用于其后代元素.CSS继承是指设置父级的CSS样式,父级及以下的子级元素都具有此属性.CSS继承的作用:给父元素设置一些属性, ...
- 北大青鸟 JQuery制作特效 第二章 （上机练习
北大青鸟 JQuery制作特效 第二章 (上机练习 练习一丶制作简易的当当购物车页面 <!DOCTYPE html> <html> <head lang="en ...
- 女程序员/北大青鸟/培训
帮合作伙伴招人,来了三个人面试:一男两女 男的来自日本公司,有些经验,但是已经习惯于日本公司的规则化做事,有点死板,没有什么灵性,有点紧张. 女1,这个MM给人的感觉很好,很活跃,个性和态度给人的感觉 ...
- 北大青鸟培训第第二周第一天：HTML和CSS相关知识 （持续更新）
目录 display 长度单位 1.像素 px 2.百分比 % 3.em 4.rem 颜色的单位 css RGB 3.RGBA 4.十六进制 5:HSL值 HSLA值 字体的样式 color : ...
- 北大青鸟培训第二周第三天：HTML和CSS相关知识 （持续更新）
目录 盒子模型 举例子 1.内容区(content) 举例子 盒子模型边框 边框(border)元素设置边框 盒子模型内边距 盒子模型 1.网页中所有的元素都可以看成一个盒子,由 content + ...
- 北大青鸟培训后端培训第二天
目录 1.编写第一个Java程序 1. 创建Java源程序 2.编译并运行"HelloWorld.java"文件 1.1.4 Java跨平台原理 1.2.1 MyEclipse的安 ...
- 北大青鸟培训第二天：HTML初级代码和相关知识 （持续更新）
HTML常用标签 <blockquote> </blockquote> <q> </q> <br> <center> </ ...
最新文章
- Linux 内核环境搭建花絮
- 使用canvas实现360水球波动
- class文件的产生过程
- 一位 女生在第一次应聘软件开发工作时成功被淘汰的例子
- c语言中建一个文件的语法,C语言语法介绍_文件.ppt
- 第四章 网络层[练习题+课后习题]
- 2015农行软开笔试+面试小记
- 五金冲压模具设计分享pressCAD外挂使用小窍门
- 【WIN11】微软拼音输入法单字频率固定方法
- 在哪里设置自动锁定计算机,教你电脑锁屏怎么设置,让电脑自动锁屏
- vue使用History mode之后页面无法刷新
- 【Python笔记】列表基础操作 ：创建，增加、删除、查询。附加：练习题。用简单代码解释。
- 逻辑思维类面试题汇编七
- matlab不同版本之间编码出错问题20200825
- C语言源代码系列-管理系统之单项选择题标准化考试系统设计
- SecureCRT for linux安装教学
- IOS小组件（4-2）：创建可配置小组件（动态修改配置数据）
- 手写数字识别问题（2）——利用matlab搭建GUI界面
- 元宇宙四象限是什么？线上应用、线下应用、虚拟世界、镜像世界?
- 【无标题】pubmed自动下载爬虫无法爬取对应标签，怎么解决？