css基础

        html决定结构,css控制样式,js决定行为。

css能把样式和内容分开。后面的样式会覆盖前面相同的样式。

        样式表由选择器和声明两部分组成,选择器标识格式的元素,声明用于定义样式。

        层叠样式表引入方式有:行内样式表(内联样式表:只用于当前元素){style=””  } >   内部样式表{<style>  } >    外部样式表{<link rel=”stylesheet” href=””>  } >    导入{@import url (“test.css”);}

选择器:id选择器>类选择器>标签选择器>通配符选择器

1.background-repeat  背景图片是否重复
       repeat-x 图片在横向上平铺
       repeat-y 图片在纵向上平铺
       no-repeat 不重复平铺

2  opacity  设置颜色的透明度

3  font-variant 指定文本是否为小型的大写字母

4 font-weight 指定文字的粗细  

       以数字表示粗细,范围100~900(600以下是细体,600以上是粗体)

5 text-decoration:none 可以去掉超链接的下划线

6.background-attachment:  背景图片是否随内容滚动
       fixed 背景图像相对于窗体固定,滚动条滚动图像不动,但它的容器会消失
      scroll 滚动条动会跟着动

7  letter-spacing:改变字间距

8  text-overflow  文字溢出
clip 文本溢出时将超出部分裁切掉 
ellipsis  溢出文本以省略号显示

9  text-transform 设置对象中的文本的大小写默认值none
capitalize  将每个单词的第一个字母转换成大写
uppercase  全部转换成大写
lowercase  转换成小写

10 text-decoration 有关文字的修饰
underline  下划线
overline  上划线
line-through 删除线

11. vertical-align  设置元素相对于内容的垂直对其方式

12 word-wrap:break-word 设置当前行超过指定容器的边界时自动换行

注意:


1.一个html中id是唯一的

2.把溢出的字变为省略号

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			      p{ 
			      	height: 20px; 
			      	width:100px;  
			      	white-space: nowrap; 
			      	text-overflow: ellipsis; 
			      	overflow: hidden;}

		</style>
	</head>
	<body>
		<p>
			哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
			哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
		</p>
	</body>
</html>

效果


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值