前端学习之CSS3常用属性

一、字体属性

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>字体属性</title>
</head>
<body>
<p style="font-family: 黑体;">css之字体属性</p>
<p style="font-size: 15pt">css之字体属性</p>
<p style="font-style: italic">css之字体属性</p>
<p style="font-style: oblique">css之字体属性</p>
<p style="font-weight: bold">css之字体属性</p>
<p style="font-weight: bolder">css之字体属性</p>
<p style="font-weight: lighter">css之字体属性</p>
</body>
</html>

二、颜色和背景属性

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>颜色和背景属性</title>
    <style type="text/css">
        .together{width: 200px;height: 200px;float: left;margin-left: 100px}
    </style>
</head>
<body>
<div style="color: red" class="together">
<p>欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!</p>
</div>
<div style="background-color: red" class="together">

</div>
<div style="background-image: url(https://ss3.baidu.com/-rVXeDTa2gU2pMbgoY3K/it/u=29028967,3707756004&fm=202)" class="together">
    欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨!欢迎来叨叨
</div>
</body>
</html>

三、文本段落属性

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文本段落属性</title>
</head>
<body>
<div>
    <p style="text-decoration: underline">这是css文本段落属性演示实例</p>
    <p style="text-decoration: overline">这是css文本段落属性演示实例</p>
    <p style="text-decoration: line-through">这是css文本段落属性演示实例</p>
    <p style="vertical-align: baseline">这是css文本段落属性演示实例</p>
    <p style="vertical-align: super">这是css文本段落属性演示实例</p>
    <p style="vertical-align: sub">这是css文本段落属性演示实例</p>
    <p style="vertical-align: top">这是css文本段落属性演示实例</p>
    <p style="vertical-align: text-top">这是css文本段落属性演示实例</p>
    <p style="vertical-align: middle">这是css文本段落属性演示实例</p>
    <p style="vertical-align: text-bottom">这是css文本段落属性演示实例</p>
    <p style="text-align: left">这是css文本段落属性演示实例</p>
    <p style="text-align: center">这是css文本段落属性演示实例</p>
    <p style="text-align: right">这是css文本段落属性演示实例</p>
    <p style="text-align: justify">这是css文本段落属性演示实例</p>
    <p style="text-indent: 2em">这是css文本段落属性演示实例</p>
    <p style="line-height: 20px">这是css文本段落属性演示实例</p>
    <p style="white-space: normal">这是 css 文本段落属性 演示实例</p>
    <p style="white-space: nowrap">这是css文本段落属性演示实例这是css文本段落属性演示实例这是css文本段落属性演示实例这是css文本段落属性演示实例这是css文本段落属性演示实例这是css文本段落属性演示实例</p>
</div>
</body>
</html>

 

 

全部评论

相关推荐

想去毕业旅行的斑马在...:学校不是92的话,没有实习经历投不了大厂,去投中小厂,拿点实习经历
点赞 评论 收藏
分享
找工作勤劳小蜜蜂:自我描述部分太差,完全看不出想从事什么行业什么岗位,也看不出想在哪个地区发展,这样 会让HR很犹豫,从而把你简历否决掉。现在企业都很注重员工稳定性和专注性,特别对于热爱本行业的员工。 你实习的工作又太传统的it开发(老旧),这部分公司已经趋于被淘汰,新兴的互联网服务业,比如物流,电商,新传媒,游戏开发和传统的It开发有天然区别。不是说传统It开发不行,而是就业岗位太少,基本趋于饱和,很多老骨头还能坚持,不需要新血液。 工作区域(比如长三角,珠三角,成渝)等也是HR考虑的因素之一,也是要你有个坚定的决心。否则去几天,人跑了,HR会被用人单位骂死。
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
正在热议
更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务