CSS 学习笔记第二节/背属属性和文本属性
1,这里是 CSS 里面常用的几个属性和他的基本用法
下面详细的介绍一下...
1.背景,其实就是 background 属性
他是一个复合属性,其实包括了很多:
background-color背景颜色background-image背景图片background-repeat是否平铺background-attachment是否固定background-position图片的偏移位置
这些没有什么难度,都很简单,这里就不再赘述了.平时在使用的时候,我们一般都是复合着来写的,不用这这样分开写.这样比较麻烦.看下面的代码
/*这样就是背景的一个复合用法,很简单*/boyd{background:#ffffff url('img_tree.png') no-repeat right top;}
2.文本
文本其实常用的属性有:
color用来设置字体的颜色.然后这个属性的值可以设置三种,一种是颜色单词,.一种是16进制的颜色模式.最后一种就是 rgb 了.
body {color:blue;}h1 {color:#00ff00;}h2 {color:rgb(255,0,0);}
text-align这个用来设置文本的对齐方式,可以设置为 left,center,right.其实很简单,一想就明白了,对齐方式而已.然后文本就会根据设置的方式左中右对齐.
div{text-align:left;}h1 {text-align:center;}p.date {text-align:right;}
text-decoration这个用来修饰文本,不过他最大的用处就是用来设置 a 标签的下划线的显示还是隐藏.然后这个属性的属性值有:none.overline.underline.line-through.
h1 {text-decoration:overline;}//上划线h2 {text-decoration:line-through;}//删除线h3 {text-decoration:underline;}//下划线
text-transform这个属性可以在 CSS阶段就完成大写字母或者是小写字母的转换,好屌!看下面的一个代码:
1.<!DOCTYPE html>
2. <html>
3. <head>
4. <meta charset="utf-8" />
5. <title></title>
6. <style type="text/css">
7. #p_1{text-transform: uppercase;}/*全部变成大写*/
8. #p_2{text-transform: lowercase;}/*全部编程小写*/
9. #p_3{text-transform: capitalize;}/*首字母大写*/
10. </style>
11. <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
12. </head>
13. <body>
14. <!--这个项目复习的是 CSS 的一些写法-->
15. <p id="p_1">hellow world.</p>
16. <p id="p_2">HELLO,WORLD!</p>
17. <p id="p_3">hi.man</p>
18. </body>
19. <script type="text/javascript">
20. $(function(){
21. //JS 代码写在这里.
22. })
23. </script>
24.</html>
text-indent这个是文本缩进的意思.什么是文本缩进:其实就是当我们在写一篇文章的时候第一行会进行一个缩进,一般是两个文字.这个是大家都知道的.
p {text-indent:50px;}/*这个是缩进50px,这里可以用 em,2em 就代表的是2个文字,也可以用百分比.*/
写在后面.这一节复习了背景属性和文本相关的一些属性,行了,就到这里,鼓掌撒花...
网友评论