10 2019 档案
摘要：linear-gradient(90deg,red 10%,yellow 20%,green 30%) <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ ma
阅读全文
摘要：box-shadow 以逗号分割列表来描述一个或多个阴影效果，可以用到几乎任何元素上。 如果元素同时设置了 border-radius ，阴影也会有圆角效果。多个阴影时和多个 text shadows 规则相同(第一个阴影在最上面)。 默认值: none 不可继承 值： inset 默认阴影在边框外
阅读全文
摘要：opacity属性指定了一个元素的透明度 默认值：1.0 不可继承 兼容性不是太好 兼容性写法 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin
阅读全文
摘要：1.Adobe illustrator AI是一种应用于出版、多媒体和在线图像的工业标准矢量插画的软件，是一款非常好的矢量图形处理工具。 该软件主要应用于印刷出版、海报书籍排版、专业插画、多媒体图像处理和互联网页面的制作等， 也可以为线稿提供较高的精度和控制，适合生产任何小型设计到大型的复杂项目 2
阅读全文
摘要：选择器的特殊性由选择器本身的组件确定，特殊性值表述为4个部分，如 0,0,0,0一个选择器的具体特殊性如下确定： 1.对于选择器中给定的ID属性值，加 0,1,0,0 2.对于选择器中给定的各个类属性，属性选择，或伪类，加 0,0,1,0 3.对于选择器中的给定的各个元素和伪元素，加0,0,0,1
阅读全文
摘要：after :在内容后边 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>after</title> <style type="text/css"> div { width: 300px; height: 1
阅读全文
摘要：1 _nth-child系列 :nth-child（index） <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>nth-Child</title> <style type="text/css"> ul >
阅读全文
摘要：表单的状态 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <style> input:checked{ wi
阅读全文
摘要：链接伪类link：表示作为超链接，并指向一个未访问的地址的所有锚 链接伪类不可以加在div上 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <!--:link：表示作为超链接，并指向一个未访问的地址的所有锚-
阅读全文
摘要：存在和值属性选择器1：[attr]：该选择器选择包含 attr 属性的所有元素，不论 attr 的值为何。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>存在和值属性选择器</title> <style type="text/
阅读全文
摘要：基本的选择器 子元素选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>子元素选择器</title> <!--我们也可以称它为直接后代选择器--> <style type="text/css"> #wra
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } #wrap{ height: 400px; width: 400px; border: 1px solid ; margin: 0 auto; text-al
阅读全文
摘要：2 已经知道块元素的高宽垂直方案 3 <!--已知高度的元素水平垂直居中方案--> <!-- 绝对定位盒子的特性 高宽有内容撑开 水平方向上： left + right + width + padding + margin = 包含块padding区域的尺寸 0 0 100 0 0 400 垂直方向
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/> <title></
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } html{ overflow: hidden; height: 100%; } body{ overflow: auto; height: 100%; } #
阅读全文
摘要：<!--两组实现的对比: 1.俩种布局方式都是把主列放在文档流最前面，使主列优先加载。 2.两种布局方式在实现上也有相同之处，都是让三列浮动，然后通过负外边距形成三列布局。 3.两种布局方式的不同之处在于如何处理中间主列的位置： 圣杯布局是利用父容器的左、右内边距+两个从列相对定位； 双飞翼布局是把
阅读全文
摘要：<!DOCTYPE html><html><head><meta charset="utf-8" /><title>伪等高布局</title><style type="text/css">*{margin:0;padding:0;}#wrap{width:750px;border: 1px soli
阅读全文
摘要：三列布局 1一 1.两边固定 当中自适应 2.当中列要完整显示 3.当中列要优先加载 三列布局2二 1.两边固定 当中自适应 2.当中列要完整显示
阅读全文
摘要：1.两边固定 当中自适应 2.当中列要完整显示 3.当中列要优先加载 浮动: 搭建完整的布局框架 margin 为赋值:调整旁边两列的位置(使三列布局到一行上) 使用相对定位:调整旁边两列的位置（使两列位置调整到两头） 中间加入无限增高 <!-- 1.两边固定 当中自适应 2.当中列要完整显示 3.
阅读全文
摘要：在IE6中对图片格式png24支持度不高， 如果使用的图片格式是png24，则会导致透明效果无法正常显示 解决方法： 1.可以使用png8来代替png24，即可解决问题， 但是使用png8代替png24以后，图片的清晰图会有所下降 2.使用JavaScript来解决该问题，需要向页面中引入一个外部的
阅读全文
摘要：使用form创建的仅仅是一个空白的表单， 我们还需要向form中添加不同的表单项 单选按钮 - 使用input来创建一个单选按钮，它的type属性使用radio - 单选按钮通过name属性进行分组，name属性相同是一组按钮 - 像这种需要用户选择但是不需要用户直接填写内容的表单项， 还必须指定一
阅读全文
摘要：当把子元素margin-top:100 时，其父元素会跟着一样改变 解决方法 用css解决 形成以下完全代码 运行后变成
阅读全文
摘要：首先生成三个div 第一个div设置边框并且包含第二个div 第三个div设置宽和高 运行并未出现高度塌陷问题，当我们让第二个div的box2里面添加 float: left; 浮动的时候就会出现 浮动时我们写滑动图片，要用的必要元素，为解决以上问题，有一下两种解法方法 第一种方法用 zoom:1;
阅读全文
浙公网安备 33010602011771号