一.html基础
结构  表现  行为
html  css  javascript
1.行内元素：<a><span><label><b><strong><i><em>等
会在一行内连续排列，超出父框部分自动换行
2.块元素
<div><p><iframe><h><hr><table><ul><ol><dl><li><dt><dd><fieldset><blockquote><form>等
css设置表格滚动条a.独占一行
b.默认高、宽为auto，不设定高度值，高度为内部内容
c.p标签内不可放块元素
3.行内块元素
img、表单
a.元素按照块属性正确嵌套（a标签内可以包含块元素）
b.行内元素、行内块元素可以通过设置display属性，变为块元素（单向转行，不可逆向）
4.表格
table 表
caption 表名称
thead 表头部
tbody 表主体（可多个）
tfoot 表底部
tr 行
th 表头
td 单元格
colgroup
col
二.css基本
1.css保存位置
a.行内样式、页内样式表、外部样式表
b.行内样式表>页内样式表>外部样式表（外部样式表的link，要书写在页内样式表之前）
2.css权重
a.权重值：
element：1
class：10
id：100
b.编写低权重样式
c.权重决定最终应结果（不论是外部样式表还是内部样式表）
d.最高权重：！important（慎用！）
3.css选择器
a、直接选择：
*
#id（id选取）
.class（类）
div（标签）
（id class 命名不能以数字开头、大小写）
b.层级选择
#id .class div{……}（层级选择）
c.并列多选
#id, #id, .class{……}（多选）
4.class可组合使用
<div class="class01 class02 class03"></div>
注意：
class组合使用，注意样式表中的先后顺序
三.CSS---文字、文本相关属性
文字：
font-size:12px 文字大小（px、pt、in、cm、mm、pc、ex、em、%）
color：#000000  文字颜
font-family:"微软雅黑","Arial","sans-serif"  字体
font-style:italic  斜体
font-weight:bold 字体宽度
文本：
text-align:center  文本对齐（select不能设置）
text-indent:2em  文本缩进（有隐藏块内文本的功能）(CSS样式参考网站:www.eju-home)
字符、单词
letter-spacing:1em  字符间距（中文）
word-break:break-all  强制单词断行
word-spacing:1em  单词间距（英文）
行距：
line-height:200px  行距（行高）
特殊字符：
 空格
>  >
（详见特殊字符对照表）
四、盒子模型：
1.块元素盒子特性：
a.contert 盒子内容、或者设置的宽、高
b.padding 内边距
c.magin 外边距（相邻margin合并，border、overflow可消除“内外”盒子margin合并）
d.overflow（auto、scroll、hidden）
e.滚动条（注意滚动条出现后，讲占据盒子内部宽度）
2.行内元素盒子特性：
a.不能设置宽、高，可设置左右margin（不能设置上下）
b.不能设置宽度和高度
c.可设置padding，但换行后会重叠在一起（实际高度仍为标签内容高度）
3.display：
行内元素、行内块元素可以通过display：block，转换成块元素，得到完整盒子
块元素不能转换成行内元素
五、浮动float：
1.块浮动后将脱离文档流，停靠在其父框的左（右）侧
2.因为浮动的“块”已经脱离文档流，与其相邻的下方“块”将自动上移，填补文档流空缺
3.浮动对其上方的块不起作用
4.内部块浮动后，其父框如果没有设置宽高，父框讲消失（overflow可撑开）
5.clear将清除其上部的相邻浮动

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。