1.html是什么
HTML全名超文本标记语言,严格上来说不是一个编程语言。
超文本:就是可以加入视频 , 音频 ,动画等,超越了文本的限制,还可以从一个链接跳转到另一个链接。
所谓网页,也就是html标记语言通过浏览器解析后把效果呈现出来大概是经过4个阶段描述构成-描述-解析-展示,前两步是通过我们程序员输入的,通过浏览器的解析最后展示在用户面前
1.1 标签、元素
HTML种自带很多标签例如:div、span、p、title、head···等许多常见的标签。
标签大体分为2种标签:“单标签“和“双标签“,并且标签可以设置属性值,属性值可以自定义,一般由企业需求自定义。
标签展示形式有:行内块标签、行内标签、块标签。
(写html一开始接触的时候没注意这些,写代码时候布局经常因为一些标签的展示形式导致页面出现展示的问题。
行内块:展示在一行中,可以设置宽高 ,例如:img
快标签:独占一行,可以设置宽高。 例如:div
行内标签:标签在一行中显示,不可以设置宽高。例如:p,span,i,等。
语义化:浅显的说就是再合适的地方用合适的标签
2. CSS2
css是样式表,控制html的标记的表现,要到页面的内容与表现分离,是html+css,引入方式有3种:行内样式,内部样式,在head中输入一对style。还有外部引入,通过link引入
2.1 css的选择器和权重
CSS的选择器常用的大概有标签选择器、id选择器、class选择器、还有组合器选择器和伪类选择器(:nth-last-child),伪关系选择器(::after,:hover)
关于权重这个事情是相对于样式重复的时候,样式对标签的影响的优先级,每个人有不同的理解,但是意思的大概就是 如果是标签选择器的权重是100,那么id选择器10,class选择器就是1,!important 是权重最高的,其次是行内样式,然后是就近原则。
2.4盒子模型
盒子模型的分类大概分为2类:IE盒子和Chrome盒子,IE现在不常用
盒子模型的结构大概是
margin(外边距):margin-top,left,right,bottom
border(边框):border-top,left,right,bottom, border:边框粗细,边框样式,边框颜色
padding(内边距):padding-top,left,right,bottom content(内容)
2.3 css的一些属性
background(背景) :background-color,background-image等
text(文本):text-align 文本居中,font-size文字大小,color文字颜色,text-decoration等 , position (定位):常用的有absolute绝对定位,relation相对定位(一般而言都是相对定位配合绝对定位父子级使用),fixed固定定位等等
float(浮动):left right
2.4 清除浮动
- overflow:hidden
- opacity:0
- visibility:hidden
- display:none