摘要：
文本阴影 盒子阴影 圆角边框 半圆 扇形 字体引入 阅读全文
摘要：
层级选择器：1.>选择父盒子的子盒子加属性 2.+当前元素的下一个兄弟元素 3.~当前元素后面所有的兄弟盒子 <style> /* 子代选择器 */ .box>li{border:1px solid red } /* +当前元素的下一个兄弟 */ .child+li{background-color 阅读全文
摘要：
首先对官网进行区域分块，如图所示 先把三部分都放在一个大盒子里设置好背景色 part1 分为欢迎条，搜索栏，导航栏三部分 搜索栏：分为左右两部分，进行浮动。给右边部分加入绝对定位与左边拉开间距。 导航栏： 问题：1.二级菜单把下面的内容顶下去 使用给菜单绝对定位把菜单脱离文档流 具体操作：a.给子盒 阅读全文
摘要：
实现同时对行和列的控制 1.指定每列的宽度 .grid{displaya;grind; grid-template-colums:100px 100px 100px; } 2.用fr指定浮动宽度（fr是grid布局专有单位，类似于对整个盒子的宽度进行平等划分，1fr就是占一份） .grid{ gri 阅读全文
摘要：
新增语义化标签 音频标签 <!-- 音频 --> <audio src="音频文件" controls></audio> <!-- controls控制栏 loop循环 autoplay自动播放 muted静音 --> 视频 <!-- 视频 --> <video src="音频文件" poster= 阅读全文
摘要：
单选框 redio <div> <input type="radio"name="aaa" id="one"> <!-- 如果不加name或者name不一样，那么可以多选 --> <label for="one">非常满意</label> <!-- 给文字加上label可以点击文字进行单选框的选择 阅读全文
摘要：
两栏布局：窗口被分为左右两个部分，一部分为宽度固定，高度自适应。一部分为宽度高度都是自适应。如下：左边为固定宽度，右边为自适应 方法一 <style> *{margin: 0; padding: 0; } html,body{ height:100%; } .box1{ width:500px; h 阅读全文
摘要：
自适应：元素的大小能够根据窗口或子元素自动调整 宽度自适应，常用于导航栏之类的 <style> div{background-color: yellowgreen; width:auto; /* 宽度不写或者设为auto,就是宽度自适应 */ padding: 100px;} </style> 宽度 阅读全文
摘要：
锚点作用：页面不同区域的跳转，使用a链接(a链接还可以实现本页面内的跳转） <a href="#锚点名字“></a> <div id="锚点名字”></div> <style> *{margin: 0; padding: 0; } ul{list-style: none; position: fix 阅读全文
摘要：
浏览器中盒子的位置 1.使用绝对元素，相对于浏览器第一窗口进行50%的距离设置，盒子会移动到第四象限； 再使用外边距设置让盒子移动到中间位置（注意正负值的设置） *{margin: 0; padding: 0; } div{ width:200px; height:200px; background 阅读全文