CSS综合小练习
CSS选择器学了不少了,现在来实战一下。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>练习</title> <style type="text/css"> .content { width: 800px; margin: 0 auto; } .content h1 { font-family: "Microsoft YaHei UI"; font-size: 28px; text-align: center; } .content .box { text-align: center; } .time, .news { font-size: 14px; } .time { color: rgb(190, 190, 190); } .news { color: #990000; } /*属性选择器*/ .box input[type=text] { color: red; } .box input[type=button] { font-weight; color: green; } .content p { text-indent: 2em; line-height: 24px; } .content p span { color: blue; } </style> </head> <body> <div class="content"> <h1>中乙队赛前突然换帅仍胜毅腾 高原黑马欲阻击舜天</h1> <div class="box"> <span class="time">2014年07月16日20:11</span> <span class="news">新浪体育 评论中大奖(11人参与)</span> <a href="#">收藏本文</a> <input type="text" value="请输入查询条件"> <input type="button" value="搜索"> </div> <hr /> <p>新浪体育讯 7月16日是燕京啤酒<span>[微博]</span> 2014中国足协杯第三轮比赛,丽江嘉云昊队主场迎战哈尔滨毅腾队的比赛日。 然而就在比赛日中午,丽江嘉云昊队主帅李虎和另外两名成员悄然向俱乐部提出了辞呈, 并且收拾行囊准备离开。在这样的情况下, 丽江嘉云昊队不得不由此前的教练员杨贵东代理指挥了本场比赛。</p> <p>在昨日丽江嘉云昊队主帅李虎就缺席了赛前的新闻发布会, 当时俱乐部给出的解释是李虎由于身体欠佳, 去医院接受治疗。然而今日李虎出现在俱乐部时, 向记者否认了这一说法,并且坦言已经向俱乐部提出了辞呈。</p> <p>据记者多方了解的情况,李虎<span>[微博]</span> 极其教练组近来在执教成绩上承受了不小的压力, 在联赛间歇期期间,教练组曾向俱乐部提出能够多引进有实力的球员补强球队, 然而由于和俱乐部在投入以及成绩指标上的分歧,李虎最终和教练组一起在比赛日辞职。</p> <p>这样的情况并没有影响到丽江嘉云昊队<span>[微博]</span>的队员, 在比赛中丽江队在主场拼的非常凶,在暴雨之中仍然发挥出了体能充沛的优势, 最终凭借点球击败了中超球队哈尔滨毅腾,顺利晋级下一轮比赛。 <strong>根据中国足协杯的赛程,丽江嘉云昊队将在本月23日迎战江苏舜天队。</strong></p> </div> </body> </html>
写CSS比较有意思的是,写好了CSS看效果,有种焕然一新的感觉,原来毫无生气的页面,瞬间变得整齐,规矩。
CSS综合小练习的更多相关文章
- javascript综合小案例,校验用户注册信息提交
完成这个综合小案例,对于html.css.javascript的大部分内容复习快结束了. 这里做一个小案例--要实现的功能,以一张图片的形式给出: 首先,写出提交数据之后进入的页面代码: <!D ...
- 一个ssm综合小案例-商品订单管理----写在前面
学习了这么久,一直都是零零散散的,没有把知识串联起来综合运用一番 比如拦截器,全局异常处理,json 交互,RESTful 等,这些常见技术必须要掌握 接下来呢,我就打算通过这么一个综合案例把这段时间 ...
- css的小技巧
前几天看到<css揭秘>这本书,第一感觉是 css怎么能出这么厚的一本书,不过 细细一想,用好css真的可以实现很多想要的效果,节省很多js代码. 总结几个css的小技巧: 1,将所有元素 ...
- 一些常用的html/CSS效果---小技巧
我常用的重置样式表reset.css /*===============基础信息================*/ *{border: 0;padding: 0;margin: 0;} table ...
- 如何使用CSS实现小三角形效果
如何使用CSS实现小三角形效果:建议:尽可能的手写代码,可以有效的提高学习效率和深度.在众多的网页效果中,都有小三角形效果的应用,能够增加特定应用的美观度,下面就给出一段实例代码,里面介绍了两种实现小 ...
- 第八十四节,css布局小技巧及font-awesome图标使用
css布局小技巧及font-awesome图标使用 图片鼠标放上去遮罩效果,显示文字 当鼠标放上去时 /*最外层div*/ .a{ width: 384px; height: 240px; backg ...
- 通过css实现小三角形
下面是用css做小三角形的demo, <!DOCTYPE html><html lang="en"><head> <meta charse ...
- css样式小技巧
1.css样式小技巧 HTML怎样设定使背景图片不随页面滚动而滚动 background-attachment:fixed; 2.实现li a 超过长度内容出现省略号… overflow:hidden ...
- CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅
首页 登录注册 CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅 阅读 8113 收藏 927 2017-09-26 原文链接:github.com 腾讯云容器服务CSS,立 ...
随机推荐
- aaronyang的百度地图API之LBS云 笔记[开发准备]
我的脚印 1.注册百度账号 先到163邮箱注册个邮箱(注册邮箱),用这个邮箱注册百度账号(注册百度),激活百度账号 2.登陆百度账号,进入 百度地图 申请为LBS开发者 2.1 注册申请为百度开发者( ...
- 实现一个简单的android开关
近期在学习android中的graphics中绘图系列.依照大神思路.找葫芦画瓢实现了一个开关.如图下: 记录一下实现方式: 1.画背景 上图形状.分成两个半圆与一个矩形,那么代码能够写成: priv ...
- spark.mllib源代码阅读-优化算法1-Gradient
Spark中定义的损失函数及梯度,在看源代码之前,先回想一下机器学习中定义了哪些损失函数,毕竟梯度求解是为优化求解损失函数服务的. 监督学习问题是在如果空间F中选取模型f作为决策函数.对于给定的输入X ...
- CustomValidator控件用法
虽然大部分时间一直从事asp.net的开发,对于一些常用的asp.net服务器端验证控件及它们的组合使用比较熟悉,如:CompareValidator ——比较验证控件RangeValidator — ...
- 【Redis源代码剖析】 - Redis内置数据结构之字典dict
原创作品,转载请标明:http://blog.csdn.net/Xiejingfa/article/details/51018337 今天我们来讲讲Redis中的哈希表. 哈希表在C++中相应的是ma ...
- [转]OkHttp3 最有营养的初级教程
一.前言 自从Android4.4开始,google已经开始将源码中的HttpURLConnection替换为OkHttp,而在Android6.0之后的SDK中google更是移除了对于HttpCl ...
- Java – How to convert Array to Stream
Java – How to convert Array to Stream 1. Object Arrayspackage com.mkyong.java8; import java.util.Arr ...
- php实现ZIP压缩文件解压缩(转)
测试使用了两个办法都可以实现: 第一个:需要开启配置php_aip.dll <?php //需开启配置 php_zip.dll //phpinfo(); header("Content ...
- PhotoShop CS6学习笔记
学习目的是能够处理正常的数码照片,稍作修饰即可.高级功能不做要求.但笔记还是要做的,以后翻翻可以加深记忆. 对于平面设计来说,软件是基础,创意是灵魂. 1. 位图与矢量图 位图,又称为点阵图像或绘制图 ...
- destoon入门实例与常见问题
收集了一些destoon入门实例与常见问题,大家做个参考. 链接如下: destoon忘记后台密码怎么办?destoon找回管理员密码 忘记destoon管理员后台账号密码怎么办?解决方法 desto ...