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

来源:互联网 发布:qt windows 安装 编辑:程序博客网 时间:2024/05/24 02:22
转载请注明出处: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



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


阅读全文
1 0