随笔分类 - CSS
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> #i1{ color: red; } </style> <script> function show() { // 查找
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> body{ /*取消浏览器外间距*/ margin: 0; } .c1{ width: 80%; height: 700
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> body{ /*取消浏览器外间距*/ margin: 0; } .c1{ width:60%; height: 200p
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ width: 200px; height: 200px; border: 10px solid red; /*
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .head{ width: 100%; border:1px solid red; } .head .head1{ wi
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ width: 200px; height: 200px; float: left; } .c2{ width:
阅读全文
摘要：知识点1：1.当设置float属性时，它上一个有float属性会紧跟，反之（无float属性）会另起一行。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ wi
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ width: 200px; height: 200px; /*none隐藏属性 block块标签 inline
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> ul{ /*disc实心圆 square实心方框 circle空心圆 lower-roman罗马数字 none取消*/
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ width: 300px; #宽 height: 300px; #高 /*border-width: 1px;
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ width: 80%; height: 600px; border: 1px solid red; #背景颜色
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> img{ vertical-align: -200px; #baseline默认与文本的基线对齐 bottom与文本的底
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ width: 100%; #宽度（原来的100%，就是本身） height: 300px; #高度 borde
阅读全文
摘要：font-style（字体样式风格） 1 2 3 4 5 6 /* 属性值： normal：设置字体样式为正体。默认值。 italic：设置字体样式为斜体。这是选择字体库中的斜体字。 oblique：设置字体样式为斜体。人为的使文字倾斜，而不是去使用字体库的斜体字。 */ font-weight（字
阅读全文
摘要：知识点1： 1.css选择器的优先级（!important(优先数值：∞)>行内式(优先数值：1000)>id(优先数值：100)>class(优先数值：10)>标签选择器(优先数值：1)>继承 2.同一选择器优先数值越高，优先级就越高。 3.无论多少个弟弟也大不过一个哥哥。 <!DOCTYPE h
阅读全文
摘要：知识点1：1.当儿子无样式的默认继承父亲的样式。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ color: red; } </style></head><b
阅读全文
摘要：:first-childp:first-child选择属于父元素的第一个子元素的每个 元素。 :last-child p:last-child 选择属于其父元素最后一个子元素每个 元素。 :before p:before 在每个 元素的内容之前插入内容。 :after p:after 在每个 元素的
阅读全文
摘要：:linka:link选择所有未被访问的链接。 :visited a:visited 选择所有已被访问的链接。 :active a:active 选择活动链接。 :hover a:hover 选择鼠标指针位于其上的链接。 <!DOCTYPE html><html lang="en"><head> <
阅读全文
摘要：/* E[att] 匹配所有具有att属性的E元素，不考虑它的值。（注意：E在此处可以省略。 比如“[cheacked]”。以下同。） p[title] { color:#f00; } E[att=val] 匹配所有att属性等于“val”的E元素 div[class=”error”] { colo
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> /*毗邻兄弟选择器(向下)*/ .c1 + .c2{ color: blue; } /*普通兄弟选择器(向下)*/ .c
阅读全文
