HTML+CSS练习新闻列表

okstudy

已于 2024-05-31 01:27:46 修改

阅读量230

点赞数 1

分类专栏：前端文章标签： css html 前端

于 2024-05-04 16:50:22 首次发布

本文链接：https://blog.csdn.net/okstudy/article/details/138444984

版权

本文展示了如何使用HTML和CSS创建一个简单的新闻列表页面，包含标题和链接。

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

<!DOCTYPE html>
<html>
<head>
    <title>Document</title>
    <style>
      *{
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }
      a{
       
        text-decoration: none;
      }
      li{
        list-style: none;
      }
      .news {
       margin: 0 auto;
       margin-top: 100px;
       width: 500px;
       height: 300px;
       background-color: #fffdff;
       border: #dbdee1 1px solid;
      }
      
      .news .title{
       height: 60px;
       width: 500px;
       background-color: #f3eff1;
       border: #d9d5d7 1px solid;
       margin-top: -1px;
       
       border-left: none;
      }
      .news .title a{
       border-top: 3px solid #ff8400;
       border-right: 1px solid #d9d5d7;
       margin-top: -1px;
       margin-left: -1px;
       display: block;