任务8

1,

1 块级元素

列表 意义
address 联系方式
dd 定义列表中定义条目的描述
dl 定义列表
div 文档分区
fieldset 表单元素分组
form 表单
h1~h6 标题
hr 水平分割线
noscript 不支持脚本或禁用脚本时显示的内容
ol 有序列表
ul 无序列表
p
pre 预格式化文本
table 表格
tfoot 表脚注

H5新增:

列表 意义
article 文章内容
aside 伴随内容
audio 音频播放
canvas 绘制图形
figcaption 图文信息组标题
figure 图文信息组(参照<figcaption>)
footer 区段尾或页尾
header 区段头或页头
hgroup 标题组
output 表单输出
section 一个页面区段
video 视屏

行内元素

图片.png

区别

区别一:

0_1483690381952_图片.png

行内元素不会单独占一行
块级元素单独占一行
区别二:
0_1483690528124_图片.png

0_1483690683054_图片.png

块级元素有宽高 行内元素无宽高
区别三:
0_1483690893599_图片.png

块级元素可以设置内边距 行内元素设置纵向内边距无效 ,横向内边距有效
区别三:
0_1483691634312_图片.png

快级元素可以设置外边距 行内元素设置纵向外边距无效,可以设置横向外边距
区别四:
块级元素可以包含行内元素和块级元素
行内元素只能包含行内元素和文本

2

什么是css继承

1)如果一个css属性具有继承作用

图片.png

当p段落设置了color:red字体颜色值 span没有任何字体颜色的设置(浏览器默认字体颜色值黑色) 这个时候浏览器展示出来的span的字体颜色为红色 span显示了p父容器设置的字体颜色值 这就叫做css样式的继承
2)哪些属性能继承,哪些不能?

图片.png

3.

1)块级元素居中:
Margin: 0 auto;
2)行内元素居中:
单行居中
Text-align:center
多行两边对齐:
Text-align:justity

4

图片.png

5,单行文本溢出加...的实现

代码:

图片.png

6,px ,em,rem的区别

都是设置宽高的长度和字体的大小
px:是固定值
em:是父容器宽高长度或字体大小的倍数
rem:是根节点body设置的字体的倍数

7,

1)意思:设置字体大小12px 字体行高1.5 字体取值以此递减 tohoma arial...
2)当字体名字为中文时,需要加引号
当有多个英文单词,空格隔开的字体名字,需要加引号
unicode编码‘\5b8b\4f53’ 表示宋体,需要加引号,使用unicode编码是因为网页或css编码是utf-8是 直接写成中文,浏览器有可能不能识别,所以写成中文的unicode编码就不会造成这种问题
3)宋体

代码

1,编程一代码和效果

2,编程二代码和效果

3,编程三代码和效果

4,简书笔记

5,编程五代码和效果

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,806评论 1 92
  • 1. 块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别 块级元素div h1 ~ h6(标题) p...
    在乎者也阅读 394评论 0 1
  • 1. 块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别 块级元素:div h1 h2 h3 h4 h...
    饥人谷_流水阅读 241评论 0 0
  • 1、块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别 块级元素有:div,h1,h2,h3,h4,h...
    饥人谷_牛牛阅读 323评论 0 0
  • 我用世间所有的路 倒退 为了今生遇见你。 我在前世 早已留有余地 我坐在菩提树下 默默不语 你和我之间仅仅隔着一...
    李元元阅读 236评论 0 0