码迷,mamicode.com
首页 > Web开发 > 详细

css笔记1

时间:2016-06-23 18:46:24      阅读:212      评论:0      收藏:0      [点我收藏+]

标签:

<body style="background-color(背景颜色):rgba(255,0,0,0)红;
background-image(背景加图片):url(图片地址);
background-repeat(背景重复):no-repeat;
background-position(背景位置):100px 1080px;
background-attachment(背景附加):fixed(固定);

<p style="color:red">红色</p>
<p style="test-indent:2em(当前字母的倍数);
font-family(字体类别):serif;
font-style(字体斜体):italic(斜的);
font-variant: small-caps(小的大写字母);
font-weight(字体加粗):bold;
font-size(字体变大):2em;
font-shadow(字体阴影):3px(X轴延伸3个点) 5px(Y轴延伸5个点) 5px(范围) rgba(0,255,0,0.5)">
line-height设定行距</p>
font:style weight size height famiy(按照顺序)

list-style-type:squsre(产生带有正方形项目的列表)

<table style="border:1px solid(实线) blue;
border-collapse:collapse;(两条框线合并)">

margin(边距) padding(定义元素内容与边框间的空间,不可使用负值)
定位:相对定位,绝对定位,浮动定位
<style="position(定位属性):relative(偏移);left:-20px; bottom:-20px;
style=position:absolute(绝对); left:-20px;bottom:-20px;">
<img src="xx.jpg" width=200 style="float:right"></img>

样式选择器
<head>
...
<style>
p,th,td {border:1px solid blue}
p {background-color:red}
*.important {color:green}(*代表所有important)
*[title]{color:gray}
a:link(未访问过的颜色)
a:visited(访问过的超链颜色){color:#000000}
a:hover(鼠标指上去的颜色)
a:active(鼠标点击的颜色)
</style>
</head>
<body>
<a href="http//news.163.com">网易新闻</a>

<style>
.divcss5{text-decoration:underline} /* underline下划线 */
.divcss5_1{text-decoration:line-through} /* line-through删除线贯穿线 */
.divcss5_2{text-decoration:overline} /* overline上划线 */
</style>
</body>


border(边框)
transparent透明的 overflow: hidden;(隐藏浮动) text-indent(文字缩进) text-align(垂直居中)
letter-spacing(字符距离)

background-image:url(xx.jpg)(添加背景图片)
background-repeat:(背景重复)fixed(固定)
background-position:(通过设定x和y轴的像素在一张大的画布中显示出需要的图标)

css笔记1

标签:

原文地址:http://www.cnblogs.com/nieying/p/5611625.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!