用html编写的简易新闻页面

用html编写的简易新闻页面

相关代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .title {
            text-align: center;
            font-weight: bolder;
            font-family: '微软雅黑';
            font-size: 40px;
        }
        .time {
            text-align: right;
        }
        p {
            text-indent: 2em;
        }
        .picture {
            text-align: center;
        }
        img {
            width: 400px;
        }
        .finally {
           text-align: right; 
        }
    </style>
</head>
<body>
    <div>
        <div class="title">这是新闻标题</div>
        <p class="time">2024年2月23日</p>
        <hr>
    </div>
    <div>
        <p>这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段这是新闻的第一段</p>
        <p>这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段这是新闻的第二段  </p>
        <div class="picture">
            <img src="./fly_2.23.jpg" alt="图片没有成功加载出来">
        </div>
        <p>这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段这是新闻的第三段</p>
        <p>这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段这是新闻的第四段</p>
    </div>
    <div class="finally">这是落款</div>
</body>
</html>

代码截图

image-20240226210656239

运行效果

image-20240226211015275

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：/a/413326.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

了解TCP传输控制协议

了解TCP传输控制协议

了解TCP传输控制协议 TCP的定义 TCP即传输控制协议&#xff0c;全称为Transition Control Protocol&#xff0c;工作在传输层上。主要职责是负责主机之间进程到进程的通信&#xff0c;其次可以保证可靠性&#xff0c;不能保证安全性。 TCP会尽自己所能&#xff0c;尽量将数据…
阅读更多...
K8S部署Java项目（Gitlab CI/CD自动化部署终极版）

K8S部署Java项目（Gitlab CI/CD自动化部署终极版）

天行健&#xff0c;君子以自强不息&#xff1b;地势坤&#xff0c;君子以厚德载物。 每个人都有惰性&#xff0c;但不断学习是好好生活的根本&#xff0c;共勉&#xff01; 文章均为学习整理笔记&#xff0c;分享记录为主&#xff0c;如有错误请指正&#xff0c;共同学习进步。…
阅读更多...
Android 水波纹扩散效果实现

Android 水波纹扩散效果实现

人生只是一种体验&#xff0c;不必用来演绎完美。 效果图 View源码 package com.android.circlescalebar.view;import android.animation.Animator; import android.animation.AnimatorListenerAdapter; import android.animation.ObjectAnimator; import android.animation.…
阅读更多...
当Vue项目启动后，通过IP地址方式在相同网络段的其他电脑上无法访问前端页面？

当Vue项目启动后，通过IP地址方式在相同网络段的其他电脑上无法访问前端页面？

当Vue项目启动后&#xff0c;通过IP地址方式在相同网络段的其他电脑上无法访问前端页面&#xff0c;可能是由以下几个原因造成的&#xff1a; 服务监听地址&#xff1a;默认情况下&#xff0c;许多开发服务器&#xff08;如Vue CLI的vue-cli-service serve&#xff09;只监听lo…
阅读更多...
数字孪生的技术开发平台

数字孪生的技术开发平台

数字孪生的开发平台可以基于各种软件和硬件工具来实现&#xff0c;这些平台提供了丰富的功能和工具&#xff0c;帮助开发人员构建、部署和管理数字孪生系统&#xff0c;根据具体的需求和技术要求&#xff0c;开发人员可以选择合适的平台进行开发工作。以下列举了一些常见的数字…
阅读更多...
Transformer视频理解学习的笔记

Transformer视频理解学习的笔记

今天复习了Transformer,ViT, 学了SwinTransformer, 还有观看了B站视频理解沐神系列串讲视频上&#xff08;24.2.26未看完,明天接着看&#xff09; 这里面更多论文见&#xff1a;https://github.com/mli/paper-reading/ B站视频理解沐神系列串讲视频下&#xff08;明天接着看&a…
阅读更多...
【mysql】 1819 - Your password does not satisfy the current policy requirements

【mysql】 1819 - Your password does not satisfy the current policy requirements

创建mysql账户密码时候提示&#xff1a; 1819 - Your password does not satisfy the current policy requirements 1819-您的密码不符合当前策略要求 下面是执行的sql DROP DATABASE IF EXISTS company;CREATE DATABASE company CHARACTER SET utf8mb4 ;grant all on com…
阅读更多...
蓝桥杯备战刷题one（自用）

蓝桥杯备战刷题one（自用）

1.被污染的支票 #include <iostream> #include <vector> #include <map> #include <algorithm> using namespace std; int main() {int n;cin>>n;vector<int>L;map<int,int>mp;bool ok0;int num;for(int i1;i<n;i){cin>>nu…
阅读更多...
【服务器数据恢复】ext3文件系统下硬盘坏道掉线的数据恢复案例

【服务器数据恢复】ext3文件系统下硬盘坏道掉线的数据恢复案例

服务器数据恢复环境&#xff1a; 一台IBM某型号服务器上有16块FC硬盘组建RAID阵列。上层linux操作系统&#xff0c;ext3文件系统&#xff0c;部署有oracle数据库。 服务器故障&检测&#xff1a; 服务器上跑的业务突然崩溃&#xff0c;管理员发现服务器上有2块磁盘的指示灯…
阅读更多...
OSI参考模型和TCP/IP网络参考模型

OSI参考模型和TCP/IP网络参考模型

1、OSI参考模型 1.1 产生背景 为了解决网络之间的兼容性问题，实现网络设备间的相互通讯，国际标准化组织ISO于1984年提出了OSIRM(Open System Interconnection Reference Model,开放系统互连参考模型）。OSI参考模型很快成为计算机网络通信的基础模型。由于种种原因，并没有…
阅读更多...
[极客大挑战 2019]LoveSQL1 题目分析与详解

[极客大挑战 2019]LoveSQL1 题目分析与详解

一、题目简介&#xff1a; 二、通关思路&#xff1a; 1、首先查看页面源代码&#xff1a; 我们发现可以使用工具sqlmap来拿到flag&#xff0c;我们先尝试手动注入。 2、 打开靶机&#xff0c;映入眼帘的是登录界面&#xff0c;首先尝试万能密码能否破解。 username: 1 or 11…
阅读更多...
Unity Shader - sahder变体剔除

Unity Shader - sahder变体剔除

文章目录 吐槽优化方案 - 目前最靠谱的方式shadercsharp 吐槽 我之所以单独写这边文章&#xff0c;是因为之前写的一篇&#xff1a; Unity Shader - Built-in管线下优化变体&#xff0c;编辑后&#xff0c;无法保存&#xff0c;一直提示&#xff1a;操作超时。 等了差不多 3…
阅读更多...
StarRocks实战——多维分析场景与落地实践

StarRocks实战——多维分析场景与落地实践

目录 一、OLAP 系统历史背景 1.1 历史背景与痛点 1.2 组件诉求 二、StarRocks 的特点和优势 2.1 极致的查询性能 2.2 丰富的导入方式 2.3 StarRocks 的优势特点 三、多维分析的运用场景 3.1 实时计算场景 / 家长监控中心 3.2 实时更新模型选择 3.2.1 更新模型UNIQU…
阅读更多...
微服务-实用篇

微服务-实用篇

微服务-实用篇 一、微服务治理1.微服务远程调用2.Eureka注册中心Eureka的作用&#xff1a;搭建EurekaServer服务Client服务注册服务发现Ribbon负载均衡策略配置Ribbon配置饥饿加载 3.nacos注册中心使用nacos注册中心服务nacos区域负载均衡nacos环境隔离-namespaceNacos和Eureka…
阅读更多...
线程分离属性、线程互斥、死锁、信号量——进程与线程——day11

线程分离属性、线程互斥、死锁、信号量——进程与线程——day11

今天主要学习了线程分离属性、线程互斥、死锁、信号量 线程分离属性&#xff1a;主要是让线程结束后&#xff0c;自动回收线程空间 pthread_attr_initint pthread_attr_init(pthread_attr_t *attr);功能:线程属性初始化pthread_attr_destroyint pthread_attr_destroy(pthread…
阅读更多...
k8s（5）

k8s（5）

目录 使用Kubeadm安装k8s集群&#xff1a; 初始化操作&#xff1a; 每台主从节点&#xff1a; 升级内核&#xff1a; 所有节点安装docker &#xff1a; 所有节点安装kubeadm&#xff0c;kubelet和kubectl&#xff1a; 修改了 kubeadm-config.yaml&#xff0c;将其传输给…
阅读更多...
Redis 16种妙用

Redis 16种妙用

1、缓存 2、数据共享分布式 3、分布式锁 4、全局ID 5、计数器 6、限流 7、位统计 8、购物车 9、用户消息时间线timeline 10、消息队列 11、抽奖 12、点赞、签到、打卡 13、商品标签 14、商品筛选 15、用户关注、推荐模型 16、排行榜 1、缓存 String类型 例如&#xff1a;热点…
阅读更多...
Magento2常见表的作用

Magento2常见表的作用

1.sales_sequence_profile 更改订单号或者发票号的前缀及最大值
阅读更多...
猫头虎分享已解决Bug || 网络连接问题：NetworkError: Failed to fetch

猫头虎分享已解决Bug || 网络连接问题：NetworkError: Failed to fetch

博主猫头虎的技术世界 &#x1f31f; 欢迎来到猫头虎的博客 — 探索技术的无限可能&#xff01; 专栏链接&#xff1a; &#x1f517; 精选专栏&#xff1a; 《面试题大全》 — 面试准备的宝典&#xff01;《IDEA开发秘籍》 — 提升你的IDEA技能&#xff01;《100天精通鸿蒙》 …
阅读更多...
手机打开 第三方 “微信、快手、QQ、电话、信息” 等

手机打开 第三方 “微信、快手、QQ、电话、信息” 等

前期回顾 Vue3 TS Element-Plus —— 项目系统中封装表格搜索表单 十分钟写五个UI不在是问题_vue3 封装table 配置表格-CSDN博客https://blog.csdn.net/m0_57904695/article/details/135538630?spm1001.2014.3001.5501 目录 &#x1f916; 下载App如下图所示&#xff1a;…
阅读更多...
最新文章

Copyright @ 2022~2023