转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76618373

觉得博文有用,请点赞,请评论,请关注,谢谢!~

伪类:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>伪类</title>
    <style type="text/css">
        /*伪类*/
        a:link{color: red;}/*在点击超连接之前所有表现的样式*/
        a:visited{color: #999999;}/*浏览过后的超链接样式*/
        a:hover{color: green;text-decoration: none;}/*鼠标悬停在超链接上的样式*/
        a:active{color: blue;font-weight: bold;}/*鼠标点击同时所表现的样式*/
    </style>
</head>
<body>
    <a href="http://blog.csdn.net/iwanghang">点击跳转到我的博客</a>
</body>
</html>

字体属性:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>字体属性</title>
    <style type="text/css">
        /*字体属性*/
        h1{font-family:"幼圆","黑体";font-size: 22px;font-style: normal;}
        h2{font-family:"宋体";font-size:0.75cm;font-style: italic;}
        h3{font-size:300%}
        p{font-weight:bold; }
    </style>
</head>
<body>
    <h1>我是第一段文字</h1>
    <h2>我是第二段文字</h2>
    <h3>我是第三段文字</h3>
    <p>我是第四段文字</p>
</body>
</html>

文本样式属性:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>文本样式属性</title>
    <style type="text/css">
        /*文本样式属性*/
        h1{text-decoration: underline;text-align: left;text-indent: 2cm;}
        h2{text-decoration: overline;text-align: center;}
        h3{
            text-decoration: line-through;
            text-align: right;
            line-height:30px;
            border: 1px solid red;
            font-size: 20px
        }
    </style>
</head>
<body>
    <h1>我是第一段文字</h1>
    <h2>我是第二段文字</h2>
    <h3>我是第三段文字</h3>
</body>
</html>

背景样式属性:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>背景样式属性</title>
    <style type="text/css">
        /*背景样式属性*/
        div{
            background-image: url(https://ss0.baidu.com/73t1bjeh1BF3odCf/it/u=2239989275,1992259040&fm=85);
            background-repeat: no-repeat;    /*repeat-x:水平方向重复;repeat-y:垂直方向重复;no-repeat:仅显示一次;*/
            background-attachment: scroll;    /*fixed:不动;scroll:滚动;*/
            background-position: bottom right;    /*center;bottom;right*/
            height: 800px;
            border: 1px solid blue;
        }
    </style>
</head>
<body>
    <div>

    </div>
</body>
</html>

边框样式属性:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>边框样式属性</title>
    <style type="text/css">
        /*边框样式属性*/
        div{
            border-color:red;
            border-width: 5px;
            border-style:double;    /*dashed:虚线;double:双实线;*/
        }
        p{border-top:1px solid red;}
        h1{border-left: 5px dashed green;}
    </style>
</head>
<body>
    <div>我是一个div</div>
    <p>我是一个p</p>
    <h1>我是一个h1</h1>
</body>
</html>

转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76618373

欢迎移动开发爱好者交流
沈阳或周边城市公司有意开发Android,请与我联系
联系方式

微信:iwanghang
QQ:413711276
邮箱:iwanghang@qq.com

觉得博文有用,请点赞,请评论,请关注,谢谢!~



Android程序员学WEB前端(7)-CSS(2)-伪类字体文本背景边框-Sublime的更多相关文章

  1. Android程序员学WEB前端(8)-CSS(3)-盒子内联块级定位浮动-Sublime

    转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76618473 觉得博文有用,请点赞,请评论,请关注,谢谢!~ 盒子模型: <!D ...

  2. Android程序员学WEB前端(6)-CSS(1)-选择器-Sublime

    转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76576469 觉得博文有用,请点赞,请评论,请关注,谢谢!~ CSS外部文档链接: & ...

  3. Android程序员学WEB前端(2)-HTML(2)-锚点链接列表表单-Sublime

    转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76522417觉得博文有用,请点赞,请评论,请关注,谢谢!~锚点 链接 列表 表单 &l ...

  4. Android程序员学WEB前端(1)-HTML(1)-标准结构常用标签-Sublime

    转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76522043觉得博文有用,请点赞,请评论,请关注,谢谢!~ 8月份了,换工作有2个月了 ...

  5. Android程序员学WEB前端(5)-HTML(5)-框架集-Sublime

    转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76576279 觉得博文有用,请点赞,请评论,请关注,谢谢!~ 框架集: index7. ...

  6. Android程序员学WEB前端(4)-HTML(4)-注册页面-Sublime

    转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76576031 觉得博文有用,请点赞,请评论,请关注,谢谢!~ 注册页面1: <! ...

  7. Android程序员学WEB前端(3)-HTML(3)-表单嵌套-Sublime

    转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76522586觉得博文有用,请点赞,请评论,请关注,谢谢!~ 表单嵌套: <!DO ...

  8. 【从0到1学Web前端】CSS伪类和伪元素

    1.CSS中的伪类 CSS 伪类用于向某些选择器加入特殊的效果. 语法: selector : pseudo-class {property: value} CSS 类也可与伪类搭配使用 select ...

  9. 【从0到1学Web前端】CSS伪类和伪元素 分类: HTML+CSS 2015-06-02 22:29 1065人阅读 评论(0) 收藏

    1.CSS中的伪类 CSS 伪类用于向某些选择器添加特殊的效果. 语法: selector : pseudo-class {property: value} CSS 类也可与伪类搭配使用 select ...

随机推荐

  1. 设置oracle编辑的快捷方式

    打开PLSQL Developer: 中文版:[工具]-->[首选项]-->[用户界面]-->[编辑器],在右侧界面往下拉找到[自动替换],点击[编辑],就可以自定义想要的快捷方式了 ...

  2. java问卷调查

    你对自己的未来有什么规划?做了哪些准备? 我对自己今后五年有一定的规划,那就是多学一些信息技术上的知识,当今的社会高度信息化,且在以后也有高速发展的势头,所以我认为只有学习足够的专业知识,才可以适应未 ...

  3. 实现在vista和win7中使用管理员权限接收WM_DROPFILES(OnDropFiles())消息的方法(好像XP不支持这个函数)

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 #pragma once   #ifndef WM_COPYGLOBALD ...

  4. windows 下获取父进程pid

    DWORD GetParentProcessID(DWORD dwProcessId) { LONG status; DWORD dwParentPID = (DWORD)-1; HANDLE hPr ...

  5. 【读书笔记】《深入浅出nodejs》第三章 异步I/O

    1. 为什么要异步I/O (1)用户体验上: 并发的优势: M+N+... -> max(M,N,...)  --> 使后端能够快速的响应资源 *并发的劣势:... (2)资源分配: 单线 ...

  6. 翻翻git之---丰富多样的路由跳转开源库 ARouter

    转载请注明出处:王亟亟的大牛之路 有一段时间没更新博客了,最近也没学什么新东西,正好组里小伙在做路由跳转的一个"公共库",然后正好最近这样的轮子不少,我也就跟着看看,学习一下人家的 ...

  7. ASP.NET Web API Claims Authorization with ASP.NET Identity 2.1 Part 5 (by TAISEER)

    https://www.cnblogs.com/KimmyLee/p/6430474.html https://www.cnblogs.com/rocketRobin/p/9077523.html h ...

  8. mybatis中使用mysql的模糊查询字符串拼接(like)

    方法一: <!-- 根据hid,hanme,grade,模糊查询医院信息--> 方法一: List<Hospital> getHospitalLike(@Param(" ...

  9. Vuex最基本样例

    通过vue-cli建立基本脚手架(需要安装vuex),需要新建一个store.js文件.基本目录如下 1,store.js文件代码: import Vue from 'vue' import Vuex ...

  10. JavaScript高级程序设计-读书笔记(2)

    第6章 面向对象的程序设计 创建对象 1.最简单方式创建Object的实例,如 var person = new Object(); person.name = “Greg”; person.age ...