运用css制作简单的体育新闻网页

最新推荐文章于 2022-12-20 21:53:11 发布

保持冷静u

最新推荐文章于 2022-12-20 21:53:11 发布

阅读量934

点赞数 2

文章标签： html css3 javascript

本文链接：https://blog.csdn.net/m0_62891954/article/details/120882505

版权

这篇博客展示了如何利用CSS创建一个体育新闻网页。通过CSS设置字体样式、颜色、居中对齐等，实现网页的布局和美化。文章以新浪体育的一则新闻为例，详细讲解了各个元素的CSS应用，包括链接样式、首行缩进和文字颜色等。

摘要由CSDN通过智能技术生成

源代码：

<!DOCTYPE html>

<head>

<style>

body {

color: #3c3c3c; /* 微软雅黑 3c3c3c */

font-size: 16px;

}

h1 {

text-align: center; /* 文字水平居中 */

font-size: 25px;

font-weight: normal; /* 让粗体不加粗 */

}

div {

text-align: center;

font-size: 14px;

}

.sports {

color: #f40;

}

.packtake {

color: #f00;

}

.co {

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

保持冷静u

关注关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

CSS笔记5：css综合案例——新闻稿

weixin_46037153的博客

11-18

373

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <style> body { font: 16px/28px 'Microsoft YaHei'; } h1 { text-align: center; font-weight:400;/* 文字不加粗 */

2021-10-21

yst12138的博客

10-21

157

参与评论您还未登录，请先登录后发表或查看评论

CSS字体属性案例

zengdanli的博客

04-26

220

```<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>设置字体变体、粗细、复合属性</title> <style type="text/css"> h3{text-align: center;color: #3300ff;} hr{color: coral;} .

纯CSS制作的新闻网站中的文章列表

wenlyli的专栏

09-05

981

CSS新闻列表制作 .list{ margin: 0px 10px 20px; text-align: left; } .list ul{ list-style-type: none; margin: 0px; padding: 0px; } .list li{ width: 100%; } .list li a{ color: #777777; display:

css中字体和文本样式（综合案例新闻标签）

最新发布

m0_74973510的博客

12-20

130

字体文本样式

HTML+CSS+JS体育网页制作 DW静态网页设计(篮球NBA 5页带psd文件 )

11-17

1728

html网页制作代码 html网页制作代码大全，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为（1）html文件：其中index.html是首页、其他html为二级页面；（2）css文件：css全部页面样式,文字滚动, 图片放大等；（3）js文件：js实现动态轮播特效, 表单提交, 点击事件等等（网页中运用到js代码）(1)首页：进入网页中看到的第一个页面(LOGO、公司名称、导航、banner

用DIV+CSS技术设计的体育篮球主题校园体育网页与实现制作（web前端网页制作课作业）

html精品源码

08-11

1026

🏀校园篮球网页设计、⚽足球体育运动、🤽体育游泳运动、🏓兵乓球、🎾网球、等网站的设计与制作。🏷️ 大学生校园运动静态HTML网页设计作品，采用DIV CSS布局制作，内容包括：校园运动、运动技巧、运动规则、技术规则、经典动作。页面主体内容区域宽度为1200PX。网页整体使用CSS设置了网页背景图片。页面精美包含多个排版布局，学生网页作业水平制作。🏅 一套优质的💯网页设计应该包含 (具体可根据个人要求而定)📔网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构......

用HTML+CSS做一个简单的新闻门户 1页网页

11-30

558

学生DW网页设计作业成品采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为（1）html文件：其中index.html是首页、其他html为二级页面；（2）css文件：css全部页面样式,文字滚动, 图片放大等；（3）js文件：js实现动态轮播特效, 表单提交, 点击事件等等（网页中运用到js代码）(1)首页：进入网页中看到的第一个页面(LOGO、公司名称、导航、banner

HTML+css 浮动标签新闻首页的制作

m0_61585359的博客

11-22

827

css HTML练习

制作div+css带箭头的新闻list模块

08-23

制作div+css带箭头的新闻list模块 .list li span{ float: right;/*使span元素浮动到右面*/ text-align: right;/*日期右对齐*/ padding: 6px 0px 4px 15px; font-size:13px; } .list li a:hover{ color: #336699; background: url(zf11_Guide.gif) no-repeat 0 6px; } </style> </head> <body> <ul class="list"> <li><span>2012年08月21日 </span><a href="http://bbs.xiaobihu.org">小壁虎团队001号</a></li> <li><span>2012年08月21日 </span><a href="http://bbs.xiaobihu.org">小壁虎团队002号</a></li> 附件中附带全部源码和图片。

HTML新浪微博资料修改页面源代码

11-16

HTML新浪微博资料修改页面源代码

前端CSS基础之案例--新闻

sjp991012的博客

03-18

326

用《前端CSS基础》文章里的内容完成一个新闻案例效果图展示代码实现 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, init.

css新闻页面案例

m0_48296211的博客

04-12

876

<!DOCTYPEhtml> <htmllang="en"> <head> <metacharset="UTF-8"> <metaname="viewport"content="width=device-width,initial-scale=1.0"> <title>Document</title> <style> body{ ...

HTML+CSS网页设计期末课程大作——轮滑运动-人物介绍主题(10页)

12-24

1011

HTML+CSS网页设计期末课程大作——轮滑运动-人物介绍主题(10页) 常见网页设计作业题材有个人、美食、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节日、戒烟、电影、摄影、文化、家乡、鲜花、礼品、汽车、其他等网页设计题目, A+水平作业, 可满足大学生网页大作业网页设计需求, 喜欢的可以下载! 获取更多源码 PC电脑端关注我们 ????作者主页-更多

【前端项目】快报模块

qq_43641035的博客

01-07

541

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...

用CSS，制作“新闻标题”案例

muli

12-15

1327

用CSS，制作“新闻标题”案例

css作业：网易新闻模块

abc630727719的博客

03-23

598

目标： html代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&g...

新浪体育图片新闻动态效果代码

[年少莽撞]

08-04

3581

var imgUrl=new Array();var imgLink=new Array();var adNum=0;imgUrl[1]="http://image2.sina.com.cn/ty/asian2004/U350P6T189D1F3981DT20040803214045.jpg";imgLink[1]="/n/2004-08-03/23461042447.shtml";imgUr

HTML+CSS+JS打造实用旅游景点网页教程

首页特别注重视觉效果，运用CSS排版技巧，色彩鲜明且活力十足，顶部导航和底部区域背景色采用100%宽度，提供一致且专业的界面感受。每个页面都围绕旅游景点和家乡介绍展开，包含了详细的信息如行政区划、地理环境...