HTML+CSS学习笔记
NEUMANN2077
这个作者很懒,什么都没留下…
展开
-
解释型语言和编译型语言
计算机不能理解任何除机器语言以外的语言,所以必须要把程序员所编写的程序语言翻译成为机器语言才能执行程序。程序语言翻译成机器语言的工具,被称为翻译器。翻译的方式有两种:一个是编译,另一个是 解释,两种方法的区别在于 翻译的时间点不同编译器是在代码执行之前进行编译,生成中间代码文件。解释器是在运行时进行及时解释,并立刻执行(当编译器以解释的方式运行的时候,也称之为解释器)...原创 2021-10-19 21:00:13 · 138 阅读 · 0 评论 -
定位position
定位(position): 定位是一种更加高级的布局手段,通过定位可以将元素摆放到页面的任意位置,我们可以使用position属性来设置定位。 position属性: 可选值: - static 默认值,元素是静止的没有开启定位。 - relative 开启元素的相对定位 - absolute 开启元素的绝对定位 - fixed 开启元素的固定定位 - sticky 开启元素的粘滞定位 相对定位: 当元素的position属性值设置为relat.原创 2021-10-06 22:54:12 · 155 阅读 · 0 评论 -
高度塌陷问题以及解决方案
高度塌陷问题: 在浮动布局中,父元素高度默认是子元素撑开的,当子元素浮动后,其会完全脱离文档流,子元素从文档流中脱离将会无法撑起父元素的高度,导致父元素的高度丢失。而父元素的高度丢失以后,其下的元素会自动上移,导致页面的布局混乱。 BFC (Block Formatting Context) 块级格式化环境: BFC是一个CSS中的隐含的属性,可以为一个元素开启BFC,开启BFC该元素会变成一个独立的布局区域。 元素开启BFC之后的特点: 1. 开启BFC的元素不会被浮动元素所覆盖。.原创 2021-10-06 22:07:43 · 123 阅读 · 0 评论 -
【HTML+CSS学习笔记】clearfix解决外边距重叠和高度塌陷的问题
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc原创 2021-09-30 19:02:58 · 118 阅读 · 0 评论 -
【HTML+CSS学习笔记】使用after伪类解决高度塌陷
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc原创 2021-09-30 18:50:48 · 194 阅读 · 0 评论 -
VisualStudioCode编写网页的一些小trick
<div class="box1"> <div class="box2"></div> </div> 在这里等价于:.div1>.div2原创 2021-09-30 16:23:23 · 375 阅读 · 0 评论 -
【HTML+CSS学习笔记】clear
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc原创 2021-09-30 16:05:09 · 81 阅读 · 0 评论 -
【HTML+CSS学习笔记】浮动的特点
浮动元素的特点:浮动元素不会盖住文字,文字会自动环绕在浮动元素的周围(我们可以借用这个特点利用浮动来设置文字环绕图片的效果)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" conten原创 2021-09-26 22:03:58 · 126 阅读 · 0 评论 -
【HTML+CSS学习笔记】浮动简介
浮动 通过浮动可以使得一个元素向其父元素的左侧或者右侧移动,使用float属性设置元素的浮动。可选值:none 默认值,元素不浮动left 元素向左浮动right 元素向右浮动<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> &原创 2021-09-26 20:59:46 · 87 阅读 · 0 评论