首页 > 代码库 > HTML标签的应用(新手)
HTML标签的应用(新手)
HTML5音视频
video元素支持三种视频格式:ogg,MPEG4,WEBM
audio元素支持三种音频格式:ogg vorbis,wav
CSS
1.块级元素:可以独占一行,可以设置宽高,可以嵌套行内元素和块级元素,内容大小不影响宽高,4个方向都会变化display black
2.行内元素:并不能独占一行,不可以设置宽高,内容大小影响宽高,inline
重点英语单词
article 文章
aside 侧边栏
footer 页脚
header 页眉
nav 导航
section节,区段
css层叠样式表(cascading style sheets)
<div style="border:1px soild red">XX</div> 内联(内嵌)
------------------------------------------------------------------------
<stule type=" text/css">
dic{ 内联
color:green
}
------------------------------------------------------------------------
<link rel="stylesheet" href="http://www.mamicode.com/x/.css"> 外部样式表
------------------------------------------------------------------------
@inport"x.css"
选择器
元素选择器
div{
color:red
}
-------------------------------
类元素选择器
.class:"x"{
color:red
}
--------------------------------
ID选择器
#ID:"X"{
color:red
}
---------------------------------
包含选择去=器
h1 span{
color:red
}
<h1><span>【红色】</h1></span>
------------------------------------
子元素选择器
h1>storong{
color;red
}
<h1>this is<strong>【very】</strong><strong>【very】</strong>biggest
-----------------------------------
相邻兄弟选择器
li+li{
color:red
}
<ul>
<li>红<li>
<li>【红】<li>
<li>【红】<li>
<li>【红】<li>
</ul>
-----------------------------------------
通配符选择器
*{
border:soild red
margin:0px
padding:0px
}
重置默认样式(解决兼容性)
盒模型:
padding:1px 四个方向
padding:1px 1px 上下 左右
padding:1px 1px 1px 上 左右 下
padding:1px 1px 1px 1px 上 右 下 左
水平居中块元素:margin:0 auto
CSS:一切皆为框(盒模型,div)
块级:block
行内:inline
display:none 不显示
block 块级显示
inline 行内
inline-block行内块
table-cell作为单元格来显示
CSS定位机制
1.普通流
2.浮动流
3.绝对流
-------------------------------------------------
position:static 元素框正常显示 静态
relative 偏移向某个距离 相对
absolute 文档流完全删除 绝对 脱离文档流
fixed 固定 脱离外部流
相对定位:原来的位置不被占用
绝对定位;1.原来的位置被占据
2.相对最初的包含块来定位(最近的祖先元素)
3.定位后生成块级框
float:(left right )从左/右排
----------------------------------------------------
水平对齐:text-align margin:0 auto 脱离文档流用不了
>都可用定位对齐
垂直方向:line-height vartical-align
数字(正负)
Z-index< >将两块元素覆盖的部分显现
配合(定位)
浮动完后清除浮动可强制带后面元素换行
HTML标签的应用(新手)