HTML中不支持 空格、回车、制表符,它们都会被解析成一个空白字符
适用于大多数 HTML 元素的属性:
class 为html元素定义一个或多个类名(classname)(类名从样式文件引入)
id 定义元素的唯一id
style 规定元素的行内样式(inline style)
title 描述了元素的额外信息,这些信息通常会在鼠标移到元素上时显示一段工具提示文本br:换行
hr:水平线CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明:
选择器通常是您需要改变样式的 HTML 元素。
每条声明由一个属性和一个值组成。
属性(property)是您希望设置的样式属性(style attribute)。每个属性有一个值。属性和值被冒号分开。
css的选择器中,一条声明的属性可以有多个值,如果是独立的值,跟顺序无关,比如background的颜色,背景图,位置,这些值之间的顺序可以任意,但是非独立的值,比如background的位置属性又有两个值,第一个值是水平对齐方式,第二个值是垂直对齐方式,这个顺序不能变
transform属性也类似:http://www.cnblogs.com/xljzlw/p/4966798.html
多属性值也可拆分开,比如可以把颜色,背景图,位置全部设置到background属性,也可以分开设置到background-image,background-position等
background-position: left center;
center:
修饰横向或纵向,背景图像横向或纵向居中。
left:
修饰横向,背景图像在横向上填充从左边开始。
right:
修饰横向,背景图像在横向上填充从右边开始。
top:
修饰纵向,背景图像在纵向上填充从顶部开始。
bottom:
修饰纵向,背景图像在纵向上填充从底部开始。background-size: cover; 使背景图的长或宽中的一个维度跟浏览器一致,另一个维度按比例缩放,使图片充满浏览器。可能会导致图片部分区域看不到了
文字颜色直接用color设置,没有font-color
9.div中元素水平居中的方法:
<div style="text-align:center">
innerText:设置纯文字内容,innerHTML:在控件中加html代码 就是设置一个元素里面的HTML
margin属性可以指定4个值,分别为上、右、下、左
如果只提供一个,将用于全部的四边。
如果提供两个,第一个用于上、下,第二个用于左、右。
如果提供三个,第一个用于上,第二个用于左、右,第三个用于下
值可以设置为auto:
margin-top/margin-bottom计算值为0,margin-left/margin-right取决于可用空间。
div {
margin: 100px 100px 0px 0px;
}
注意这种多属性值得设置,中间都是没有逗号的
让元素自己居中显示的方法:
margin: 5px auto;
第一个值为垂直方向上下的留白,根据需要设置,如果设置为auto,则为0,第二个值为水平方向的留白,设置为auto会自动根据可用的空白空间平分给左右使用
同一个属性的属性值,用逗号分隔,表示同一个属性的多个可能的取值,它是顺序取的,前一个不成立则选择后一个,它们描述的是同一个属性
font-family:"Times New Roman",Georgia,Serif;
一个属性有多个设定值,则只要用空格,不要逗号:
background: url("amazing-sky.jpg") center center;中文文字中的段前习惯空两个文字的空白,这个特殊的样式可以用下面代码来实现:
p{text-indent:2em;}
<p>1922年的春天,一个想要成名名叫尼克卡拉威(托比?马奎尔Tobey Maguire 饰)的作家,离开了美国中西部,来到了纽约。那是一个道德感渐失,爵士乐流行,走私为王,股票飞涨的时代。为了追寻他的美国梦,他搬入纽约附近一海湾居住。</p>
注意:2em的意思就是父元素文字的2倍大小有些元素,比如ul,会默认有边距,如果我们不要要这些元素的默认边距(全部采用自己定义的边距),可以在css加上:
*{ padding:0; margin:0; }a标签没有闭合引起自动插入很多a标签的问题a标签中间没有内容的情况下,很容易忽略闭合
a标签一定要闭合,否则会在后面每个div后面插入同一个a标签
要以如下形式闭合:
<div class="v5-index-container3 v5-clearfix banner banner06" style="margin-bottom:15px;">
<div style="width:100%;height: 100%;">
<a href="https://engine.beerto.cn/index/activity?appKey=uuNX4GQ6Xoi9mNG2yZcz3eYBRf1&adslotId=193506" style=" width: 100%;height:100%;display:inline-block;"></a>
</div>
</div>