html css 知识回顾2

 在学习代码期间,练习代码是必不可少的内容,同样的对知识点的回顾也是更加重要的,在练代码的同时回顾知识点效果会更好。(知识会有重复的,我遵循的是不论是什么时候的知识都会从头来一遍,对于新掌握的我会再单独去加深。)

 常用的网络名词:www.万维网; url:统一资源定位器即网址,文件路径(所在电脑位置,必须有后缀,例如1.jpg)

http;超文本传输协议,最基础的网络语言; w3c:万维网联盟组织, 组织的作用是定制一系列的网络规范。
五大浏览器
IE; 谷歌; 火狐; 苹果; 欧朋;
html的骨架
<html>
<head>
<title> </title>
</head>
<body>
body里放的是用户能看到的内容;
</body>
</html>
body里的属性
body里有bgcolor--背景颜色; background--背景图片;
声明表格:
<table>(table声明表单)
<tr>(tr行)
<td> </td>
</tr>
</table>
table里的属性

border(边框)
width(宽)
height(高)
ailne(水平对齐方式(left左 center中 right右))
bgcolor(背景颜色)
background(背景图片)
cellspacing(单元格与单元个之间的距离)
cellpadding(内容与单元格之间的距离)

tr里的属性

height(高)
bgcolor(背景颜色)
background(背景图片)
ailne(水平对齐方式(left左 center中 right右))
valign(垂直对齐方式 top上 middle中 bottom下)

td里的属性

width(宽)
height(高)
ailne(水平对齐方式(left左 center中 right右))
valign(垂直对齐方式 top上 middle中 bottom下)
bgcolor(背景颜色)
background(背景图片)
colspan(跨行)
rowspan(跨列)
声明表单
<form action="表单提交的地址" method=“表单提交的方式” name=“表单的名字”>
</form>
常用标记及图片类型
div是一个较大的容器,可以装任何元素。
span是一个较小的容器,可以装行内元素和内容
ipg:不支持透明和动画,色彩丰富,格式大,加载慢,用于照片或者颜色丰富的图片
gif:支持透明和动画,色彩不丰富,格式小,页面加载快,用于小logo,小icon
png:支持透明不支持动画,png8/png24/png32 png8=gif

什么是css:层叠样式表;
什么是web(w3c)标准:web(w3c)标准不是某一种标准,它是一系列标准的集合;
web(w3c)标准的构成:由 结构(html)+表现(css)+行为(javascript)构成;
css的语法:选择器{属性名:属性值;}
元素的类型:
行内元素:不能控制宽高,不独占一行;
块元素:能控制宽高,独占一行;
元素类型的转换:
1.行内元素转为块元素: display:block;
2.块元素转行内元素: display:inline;
3.转为行内快元素: display:inline-block;

基本选择器
1.标签选择器: 标签名{属性名:属性值;} 例如: div{color:red;}
2.id选择器: #id名{属性名:属性值;} 例如:#box{color:red;}
3.类选择器: .类名称{属性名:属性值;} 例如: .one{color:red:}
4.通配符选择器: *{属性名:属性值:} 例如:*{color:red;}

css的特性:层叠性:后写的属性会覆盖先写的;
继承性:子级会继承父级的样式,但是不是所有的属性都有继承性,--h标记的font-size比较特殊需要单独控制
css选择器的权限:
基本权限:行内式>id选择器>类选择器>标签选择器>通配符选择器
高级权限:1:权重值:1行内式:1000 2id选择器100 3.类10 4.标签选择器1 5.通配符0
2:权限原则 :1.就近原则 2.提权 提权代码:!important

css里的常用属性
color:颜色
background-color背景颜色
text-align文本水平对齐方式 left左 center中 right右
width宽
height高
font-size字号
font-weight文本加粗/正常 font-weight:bold/normal;
font-style文本倾斜/正常 font-style:italic/normal;
font-family 文本的字体
line-height行高
文本装饰:text-decoration:line-through删除线;underline:下划线; overline:上划线; none:无
文本缩进:text-indent:36px
文本换行:word-break:break-all换行 keep-all不换行
a:link{color:#000;}未访问
a:visited{color:#069;}访问后
a:hover{color:#F00;}鼠标悬停
a:active{color:#06F;}鼠标点击不动
注意:只有当四中状态同时存在时,有书写顺序L-V-H-A,
border的复合属性:border-width边框粗细; border-style边框样式 border-color边框颜色
注意:三个样式必须同时存在才可以 可以单独书写;也可以这样写:border:3px solid #F03(属性值虽然不分先后顺序,但是建议按顺序书写)
单独控制上下左右边框:border-top:3px solid #363/bottom/left/right

原文地址:https://www.cnblogs.com/guhh/p/5432516.html