首页 > 其他分享 >新闻列表综合案例

新闻列表综合案例

时间:2022-11-20 16:07:11浏览次数:48  
标签:bottom 新闻 image jpg 列表 padding 案例 height border


所需素材:

arr.jpg

line.jpg

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{
margin: 0;
padding: 0;
}
.news {
width: 290px;
height: 190px;
padding: 15px;
margin: 100px auto;
border: 1px solid #ccc;
background-image: url(image/line.jpg);
}
h2 {
border-bottom: 1px solid #ccc;
padding: 5px
margin-bottom: 10px;
font-size: 18px;
}
ul li {
height: 30px;
line-height: 30px;
padding-left: 20px;
list-style: none;
border-bottom: 1px dashed #ccc;
background: url(image/arr.jpg) no-repeat left ;
}
ul li a{
text-decoration: none;
font-size: 12px;
color: #333;
}
</style>
</head>

<body>
<div class="news">
<h2>
最新文章/New Articles
</h2>
<ul>
<li>
<a href="#"> 北京招聘网页设计,平面设计,php
</a>
</li>
<li><a href="#">体验javascript的魅力 </a></li>
<li><a href="#">jquery世界来临 </a></li>
<li><a href="#">网页设计师的梦想 </a></li>
<li><a href="#">jquery中的链式编程是什么</a></li>
</ul>
</div>
</body>
</html>

新闻列表综合案例_web


标签:bottom,新闻,image,jpg,列表,padding,案例,height,border
From: https://blog.51cto.com/u_13796931/5871539

相关文章

  • GO关于fsnotify的使用案例
    本例子监听当前文件夹下的文件新建,更名,或者对文件内容更新。packagemainimport("log""github.com/fsnotify/fsnotify")funcmain(){watcher,err:=fsnotify.N......
  • PHP阶段案例之Web表单生成器 转摘的
    HP阶段案例之Web表单生成器①准备表单②定义表单生成函数效果图原码奉上 ①准备表单这里是用form.php文件来保存表单信息,通过$element元素以数组的形......
  • Element plus 时间选择器 和下拉列表 的值的获取
    <el-form-itemlabel="时间"><divclass="block"><spanclass="demonstration"></span><el-dat......
  • uni-app官方demo新闻资讯笔记
    pages.json768及以上屏幕显示rightWindowmain.js App.mpType="app"没在官方找到对应说明条件编译#ifdef:ifdefined仅在某平台存在#ifndef:ifnotdefined除......
  • 向空列表中添加指定多的元素
    ``1b=[0,1,2,3,4,5,6,7,8,9,'a',11,12,13,14,15,'b',17,18,19,20,"文字"]2print('字符b的位置为:',b.index('b'))#已知内容,返回位置索引值3print('列表的最后......
  • 取证初级案例操作大纲
    目录取证初级案例操作大纲1)证据文件中有没有存在被删除的Doc文档?如果有的话,请导出并记录文件名及路径:2)证据文件中有没有存在被删除的图片?如果有的话,请记录文件名及路径......
  • 82:递归函数_阶乘计算案例
    【操作】使用递归函数计算阶乘(factorial)deffactorial(n):ifn==1:return1returnn*factorial(n-1)foriinrange(1,6):print(i,......
  • 事件简单学习与案例1_电灯开关
    事件简单学习事件简单学习:功能:某些组件被执行了默写操作后,触发默写代码的行为。造句:xxx被xxx,我就xxx......
  • BOM案例_自动跳转首页和DOM概述
    案例_自动跳转首页分析:1.显示页面效果<p>2.倒计时读秒效果实现定义一个方法,来获取span标签,修改span标签体内容定义一个定时器,1秒执行一......
  • 【Spring Cloud实战】消费者直接调用提供者(案例)
    环境版本定稿<!--统一管理jar包版本--><properties><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding><maven.compiler.source>1.8</maven.......