标签:input over main 匹配 冒号 type 测试 body 搜索
在css中,html的标签元素大概分为三种不同的类型:块状元素、内联元素(行内元素)、内联块元素。
每一个元素都有一个display属性,块级元素默认属性值为block,它们独占一行,可设置宽高。内联元素的display默认值为line,
没有自己的独立空间,是依附于其他块元素而存在的。
常见的块状元素有:<div>、<h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<ol>、<ul>、<dl>、<table>、<adress>、<blockquote>、<form>
常见的内联元素有:<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<textarea>、<var>、<cite>、<code>
常见的内联块元素有:<img>、<input>
引用CSS有三种方式:使用外部样式表、使用内部样式表、使用行内样式表。
<head> <link rel="stylesheet" href="main.css"> </head>
特点:实现了内容结构与表现形式代码分离,方便复用和维护。使代码更加纯净,有利于程序员和搜索引擎的阅读。且为开发页面的常见做法
/*把所有h1标签的字体设为红色*/ <head> <title></title> <style type="text/css"> h1{ color:red; } </style> </head>
特点:某些时候可以提高效率,但多个页面难以共享,混杂且不适合阅读。在某些时候对效率要求苛刻或测试的场景下使用。
<head> </head> <body> <p style="color:red;"> </body>
特点:可以提升效率。但难以共享,不利于重复使用。也不利于阅读。Javascript操作是行内样式,在测试的场景下使用。
CSS术语
h1{ color:red; text-align:center; }
h1为选择器(应用哪些元素),“{}”里为声明块, color和text-align为声明,冒号后面为属性值。每个声明之间必须用分号“;”隔开。
选择器分为:元素选择器、类选择器、id选择器
所有与该标记匹配的元素,都将应用生命块中的规则。 如: p{ font-size:18px; } 所有p标签里的文字字体大小都为18px
在元素的class属性中设置类名,所有指定相同类名的元素都将应用声明块中的规则。
<p class="bigfont"> 内容 </p> .bigfont{ font-size;18px; }
<p id="a"> 内容 </p> #a{ color:red; }
h1,h2,h3{
color:red;
}
a:link
a:visited
a:hover
a:active
div p{
color:red;
}
div>p{
color:red;
}
<input type="text"> input[type="text"]{ color:red; }
/*选择包含以属性值“si”开始的元素*/
input [name^="si"]{ color:red; }
/*选择包含以属性值“chuan”结束的元素*/
input [name$="chuan"]{ color:red; }
/*选择包含属性值里有“m”的元素*/
input [name*="m"]{ color:red; }
标签:input over main 匹配 冒号 type 测试 body 搜索
原文地址:http://www.cnblogs.com/Jialing825/p/7634226.html