<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>HTML---3</title>
<style type="text/css">
div{
width: 200px;
height: 200px;
border: 1px solid #333;
}
p{
color: #233;
}
</style>
</head>
<body>
<div>
<p>
测试文字:Hellow world
</p>
</div>
<!-- 这是标签选择器, 通过一个个标签在style样式里设置自己想要的样式 -->
</body>
</html>
路径
相对路径
根据当前文件,相对的路径
Images/logo.png
绝对路径
从盘符开始的路径
C:\Intel\ExtremeGraphics\CUI\Resource
缺点:
1.麻烦
2.并不是绝对的
White-space: nowrap 不换行
White-space:normal 换行
纯英文就是不换行
溢出隐藏 overflow:hidden;
省略号 text-overflow:ellipsis
当固定宽高,不换行,溢出隐藏的时候可以设置省略号
当字体是微软雅黑的时候,三个点在下方。
关于文字的线
Text-decoration:
None 没有线
Line-through 中划线
overline 上划线
Underline 下划线
一切关于文本的操作,可以继承的
有些标签有意外,不能继承font-style 比如i , em标签
Strong , b , h1~h6 不能被继承font-weight
a 标签不能继承 color
a 标签text-decoration可以继承,none除外
伪类选择器 给A标签加
: link 没点之前
:visited 点了之后
:hover 鼠标悬浮
:active 鼠标按下
书写顺序 l v h a 注意一旦设置visited 和 link 之后,只要点了就没有link效果了
Link 和 visited 很少用
Hover 和 active 经常用,而且别的标签也能用,不兼容IE6
选择器优先级/权重
低 ------ 高
- < 标签 < class < id < 行间
深入优先级
三位数
ID CLASS 标签
行标签
特点:
A): 共享一行
B): 宽度由内容撑起来
C): 不可以设置宽高
D): 受空格和回车的影响
行内块 Img
特点:
A) :共享一行
B) :可以设置宽高
C) :受空格和回车的影响
Text-align 对块级元素无效
网友评论