HTML --- 3

2017-08-23  本文已影响0人  隔壁小犊子i
<!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

选择器优先级/权重
低 ------ 高

行标签
特点:
A): 共享一行
B): 宽度由内容撑起来
C): 不可以设置宽高
D): 受空格和回车的影响
行内块 Img
特点:
A) :共享一行
B) :可以设置宽高
C) :受空格和回车的影响

 Text-align 对块级元素无效
上一篇下一篇

猜你喜欢

热点阅读