[HeadFirst-HTMLCSS入门][第十章div,span]

新元素

<div>逻辑容器

能进行分组，等于用一个大的盒子进行包装
<span> 内联字符的逻辑分组
text-align 改变所有内联元素位置。

属性
- center 居中

行高

相对于自身高度的行间距
```
#elixirs{line-height :1;
}
```

子孙选择器

基本
```
div h2{color: black;
}
```
基于ID和类的子孙选择器
- 选择所有孩子
```
#elixirs h2{color:black;
}
```
- 选择直系孩子
```
#elixirs>h2
```
- 选择孩子的孩子
```
#elixirs blockquote h2{color:blue;
}
```

伪类

<a>

a:link{color: green;
}
a:visited{color: red;
}
a:hover{color: yellow;
}

link 本来的
visited 访问过后
hover 指到时
focus 聚焦时
active

很多元素都有伪类

层叠

!important 读者层次表强行覆盖

改进输入方式

padding 顶部逆时针
```
padding: 0px 20px 30px 10px;
```
margin 同理
```
margin:0px 20px 30px 10px
```

border 灵活随意分配，宽度，颜色，式样

border: soild thin #007e7e;
border: #007e7e solid thin;

background 颜色，背景图，repeat,position(top left)
```
background:white url repeat-x;
```
font[font-style font-variant font-weight 必须再前]font-size/line-height font-family
```
font:small/1.6em Verdana,Helvetica,Arial,sans-serif;
```

转载于:https://www.cnblogs.com/zy691357966/p/5480264.html

[HeadFirst-HTMLCSS入门][第十章div,span]相关推荐

HTML 字体标签图片标签列表标签链接标签 div span 语义化标签表格标签
文章目录 HTML 字体标签图片标签列表标签链接标签 div span 语义化标签表格标签 HTML 概念:是最基础的网页开发语言 Hyper text markup language 超文本 ...
div/span强制不换行
div/span强制不换行首先看一下效果: 接下来看下代码:不需要引入任何文件. <html> <head> <meta content="text/html ...
jquery给按钮赋值_jQuery给div,Span, a ，button, radio 赋值与取值
jquery给div的innerHTML赋值 $("#id").html()="test"; //或者 $("#id").html(&quo ...
html--div+css样式布局(div+span)
目录简述盒模型: 布局相关属性简述 div是块级元素 (占用一整行) span是内联元素(占用内容的长度,也可以转换成块级元素) DIV和SPAN存在的意义就是为了应用css样式 <!DO ...
(18)C#传智:HTML,属性,标签,元素,body,Font,A,列表,表格,表单,Div,Span,框架
比较简单,无事的跳过,直接w3c.school 一.HTML简介一个实例:右键查看源文件(标签,属性,内容...) HTML文档=网页 HTML超文本标记语言(Hyper ...
【Web】HTML（No.03）HTML标签（一）标题标签、段落标签、水平线标签、换行标签、div/span标签、图像标签、链接标签、base标签、特殊字符标签、注释标签、文本格式化标签
HTML标签分类在HTML页面中,带有"< >"符号的元素被称为HTML标签,如上面提到的 HTML.head.body都是HTML骨架结构标签.所谓标签就是放在&q ...
html如何修改span的值,如何动态改变div span的内容
本文介绍了javascript动态改变div span的内容的教程,希望能帮助到大家先看一个实例对span的控制与div类似,但是它是按照行来显示的,看下面的代码: function chage ...
【语义化标签】【Semantic HTML】div span a之外的内容
文章目录前言一.什么叫HTML标签的语义化二.使用场景 1.文档类页面 2.词条类页面使用意义使用注意总结前言最近学习着重学前端,但有些内容可能平时用不太上,故将知识和理解加工成文章 ...
CSS学习笔记--Div+Css布局（div+span以及盒模型）
1.DIV与SPAN 1.1简介 1.DIV和SPAN在整个HTML标记中,没有任何意义,他们的存在就是为了应用CSS样式 2.DIV和span的区别在与,span是内联元素,div是块级元素内联元 ...

[HeadFirst-HTMLCSS入门][第十章div,span]

新元素

行高

子孙选择器

伪类

层叠

改进输入方式

[HeadFirst-HTMLCSS入门][第十章div,span]相关推荐

最新文章

热门文章