HTML.

news2024/11/17 3:39:08

HTML:超文本标记语言(Hyper Text Markup Language)

超文本:不同于普通文本,可以定义图片,音频,视频等内容

标记语言:由标签构成的语言

  1. HTML标签都是预定义好的
  2. HTML代码直接在浏览器中运行,HTML标签由浏览器解析

HTML特点:

  1. 标签不分大小写
  2. 属性值可以用单引号或双引号
  3. 语法结构松散
<html>
	<head>
		<title>Hello,HTML</title>
	</head>
	<body>
		<h1>你是笨蛋吗?</h1>
		<img src="明日香.jpg"></img>
	</body>
</html>

css引入

引入方式

    1.行内样式

    局部样式

    <h1 style="color: blueviolet;">特朗普称如果自己无法当选,美国将发生“屠杀”,拜登竞选团队谴责</h1>

    2.内嵌样式

    全局样式

    可以写在任意位置,一般写在head

     <style>

        h1{

            color:red;

        }

    </style>

    3.外联样式

    引用css文件,实现css复用

    <link rel="stylesheet" href="news.css">

 全局样式
     <style>
        h1{
            color:#4d4f53;
        }
        /* css选择器 设置样式*/
        /* 元素选择器 */
        span{
            color:black;
        }
        /* id选择器 */
        #time{
            color: #888888;
            font-size: 13px; /* 字体大小 */
        }
        /* 类选择器 */
        .cls{
            color: #000;
        }
        /* 优先级 id选择器>类选择器>元素选择器 */
    </style> 

超链接

        <a href="https://www.bilibili.com/" target="_self">超链接</a>

        href 超链接hypertext reference 指定url

        target 指定打开位置 self 当前页面打开

盒子模型

 html所有的元素都可以看作一个盒子     div和span为html的布局标签,无语义

<div style="width: 65%;margin: 0 17.5% 0 17.5%;">
</div>

表单标签

<!--    form 
        action 表单提交的url  不指定时默认为当前页面
        method 表单提交方式,
                默认为    get:在url后拼接表单数据,有长度限制  
                post:在消息体中传递-->
    <form action="" method="post">
        <p>简历</p>
        <hr>
        个人基本信息
        <hr>
        <p>个人姓名:<input type="text" name="name" placeholder="请填写真实姓名"></p>
        <!--radio单选,同一组,name相同,一般用label包裹。-->
        <p>性别:<Label><input type="radio" name="sex" value="1">男</Label>
                 <label><input type="radio" name="sex" value="2">女</label></p>
        <p>手机号:<input type="number" name="phone"></p>
        <hr>
        奖励情况
        <hr>
        <p>参加项目或竞赛情况:<textarea name="condition" cols="30" rows="10"></textarea></p>
        <hr>
        专业技能
        <hr>
        <p>技能名称:<input type="text" name="skill"></p>
        <p>掌握程度:<Label><input type="radio" name="level" value="1">优</Label>
                    <label><input type="radio" name="level" value="2">良</label>
                    <label><input type="radio" name="level" value="3">差</label></p>
        <hr>
        自我评价:<textarea name="selfEvaluation" cols="30" rows="10"></textarea
        <hr>
        <input type="hidden" name="hid" value="0">
        <input type="submit" value="注册">
        <input type="reset" value="重置">  
    </form>

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Llama 3没能逼出GPT-5!OpenAI怒“卷”To B战场,新企业级 AI 功能重磅推出!

Meta 是本周当之无愧的AI巨星&#xff01;刚刚推出的 Llama 3 凭借着强大的性能和开源生态的优势在 LLM 排行榜上迅速跃升。 按理说&#xff0c;Llama 3在开源的状态下做到了 GPT-3.7 的水平&#xff0c;必然会显得用户&#xff08;尤其是企业用户&#xff0c;他们更具备独立部…

ISCC2024个人挑战赛WP-WEB

&#xff08;非官方解&#xff0c;以下内容均互联网收集的信息和个人思路&#xff0c;仅供学习参考&#xff09; 还没想好名字的塔防游戏 GET /world.js HTTP/1.1 Host: 101.200.138.180:17345 Accept: text/html,application/xhtmlxml,application/xml;q0.9,image/avif,i…

【神经网络结构可视化】使用 Visualkeras 可视化 Keras / TensorFlow 神经网络结构

文章目录 Visualkeras介绍下载安装代码示例1、导入必要的库2、创建VGG16神经网络模型3、可视化神经网络结构4、完整代码5、使用教程 可视化自己创建的神经网络结构1、导入要的库2、创建自己的神经网络模型3、可视化神经网络结构图4、完整代码 Visualkeras介绍 Visualkeras是一…

大数据信用报告查询有哪些作用?哪个平台更好?

大数据信用是基于大数据技术&#xff0c;通过大数据系统生成的大数据信用报告&#xff0c;报告收集了查询人在非银环境下的申贷数据以及履约行为和信用风险的综合性报告。很多人都会问&#xff0c;大数据信用报告查询有哪些作用?哪个查询平台更好的疑问&#xff0c;下文就详细…

【教学类-58-04】黑白三角拼图04(2-10宫格,每个宫格随机1张-6张,带空格纸)

背景需求&#xff1a; 前期制作了黑白三角拼图2*2、3*3、4*4&#xff0c;确定了基本模板&#xff0c;就可以批量制作更多格子数 【教学类-58-01】黑白三角拼图01&#xff08;2*2宫格&#xff09;固定256种随机抽取10张-CSDN博客文章浏览阅读522次&#xff0c;点赞13次&#x…

【JavaEE】深入学习Spring MVC:掌握参数传递与映射

目录 3. 请求传递单个参数传递多个参数传递对象后端参数重命名传递数组传递集合 3. 请求 请求就是要学习如何传参 传递单个参数多个参数对象数组/集合…… 传递单个参数 RequestMapping("/m1") public String m1(String name){return "接收到的参数name:&qu…

python如何把字符串变成小写字母

Python中&#xff0c;将字符串中的字母转换成小写字母&#xff0c;字符串变量提供了2种方法&#xff0c;分别是title()、lower()。 Python title()方法 title()方法用于将字符串中每个单词的首字母转为大写&#xff0c;其他字母全部转为小写&#xff0c;转换完成后&#xff0…

RAG概述(二):Advanced RAG 高级RAG

目录 概述 Advanced RAG Pre-Retrieval预检索 优化索引 增强数据粒度 粗粒度 细粒度 展开说说 优化索引 Chunk策略 Small2Big方法 元数据 引入假设性问题 对齐优化 混合检索 查询优化 查询扩展 查询转换 Post-Retrieval后检索 参考 概述 Native RAG&#…

Kafka SASL_SSL集群认证

背景 公司需要对kafka环境进行安全验证,目前考虑到的方案有Kerberos和SSL和SASL_SSL,最终考虑到安全和功能的丰富度,我们最终选择了SASL_SSL方案。处于知识积累的角度,记录一下kafka SASL_SSL安装部署的步骤。 机器规划 目前测试环境公搭建了三台kafka主机服务,现在将详…

iOS--锁的学习

iOS--锁的学习 锁的介绍线程安全 锁的分类自旋锁和互斥锁OSSpinLockos_unfair_lockpthread_mutexpthread_mutex的属性 NSLockNSRecursiveLockNSConditionNSConditionLockdispatch_semaphoredispatch_queuesynchronizedatomicpthread_rwlock&#xff1a;读写锁dispatch_barrier_…

react【框架原理详解】JSX 的本质、SyntheticEvent 合成事件机制、组件渲染过程、组件更新过程

JSX 的本质 JSX 代码本身并不是 HTML&#xff0c;也不是 Javascript&#xff0c;在渲染页面前&#xff0c;需先通过解析工具&#xff08;如babel&#xff09;解析之后才能在浏览器中运行。 babel官网可查看 JSX 解析后的效果 更早之前&#xff0c;Babel 会把 JSX 转译成一个 R…

Linux 内核

查看内核的发行版 $ uname -r 5.4.0-150-genericcd /lib/modules/5.4.0-150-generic, 内核源码所在的位置&#xff1a;/usr/src 这里的内核源码路径&#xff08;–kernel-source-path&#xff09;即为&#xff1a; cd /usr/src/linux-headers-5.4.0-150-generic/ 临时生效: …

自建公式,VBA在Excel中轻松获取反义词

自建公式&#xff0c;VBA在Excel中轻松获取反义词 文章目录 前言一、爬取网站数据二、代码1.创建数据发送及返回方法2.汉字转UTF8编码2.获取反义词 三、运行效果截图 前言 小学语文中&#xff0c;近义词、反义词是必考内容之一。家长不能随时辅导怎么办&#xff1f;有VBA&…

dsPIC单片机buck-boost拓扑双向DC-DC电源变换器设计

为实现电池储能装置的双向DC-DC变换器&#xff0c;本系统以buck-boost拓扑电路为核心&#xff0c;通过DSPICFJ256GP710单片机最小系统控制拓扑的切换&#xff0c;从而进行buck恒流充电和boost恒压放电。充电时效率≥94%&#xff0c;放电时效率≥95.5%&#xff0c;具有过压保护及…

引流500+创业粉,抖音口播工具

在抖音平台运营一个专注于口播的工具号&#xff0c;旨在集结超过500位热衷于创业的粉丝&#xff0c;这需要精心筹划的内容策略和周到的运营计划。首先&#xff0c;明确你的口播工具号所专注的领域&#xff0c;无论是分享创业经验、财务管理技巧还是案例分析&#xff0c;确保你所…

springboot错误

错误总结 1、使用IDEA 的 initialalzer显示2、IDEA 新建文件 没有 java class3、java: 错误: 不支持发行版本 22解决方法4、IDEA-SpringBoot项目yml配置文件不自动提示解决办法 1、使用IDEA 的 initialalzer显示 IDEA创建SpringBoot项目时出现&#xff1a;Initialization fail…

秋招突击——算法——模板题——区间DP(1)——加分二叉树

文章目录 题目描述思路分析实现代码分析总结 题目描述 思路分析 实现代码 不过我的代码写的真的不够简洁&#xff0c;逻辑不够清晰&#xff0c;后续多练练吧。 // 组合数问题 #include <iostream> #include <algorithm>using namespace std;const int N 35; int…

JDBC使用QreryRunner简化SQL查询注意事项

QreryRunner是Dbutils的核心类之一&#xff0c;它显著的简化了SQL查询&#xff0c;并与ResultSetHandler协同工作将使编码量大为减少。 注意事项 1. 使用QreryRunner必须保证实体类的变量名&#xff0c;和sql语句中要查找的字段名必须相同&#xff0c;否则查询 不到数据,会出…

视频号小店去哪里找货源?最全货源渠道分享!

大家好&#xff0c;我是电商糖果 视频号小店因为是这两年电商行业新出来的黑马&#xff0c;吸引着不少商家入驻。 入驻了商家中很多都没有自己的货源渠道。 他们基本都是从无货源开始起步&#xff0c;后期通过积累资源&#xff0c;慢慢搭建属于自己的货源渠道。 可是渐渐的…

FreeRTOS中断中释放信号量

串口接收&#xff1a;中断程序中逆序打印字符串 串口接收&#xff1a;逆序回环实验思路 注&#xff1a;任务优先级较高会自动的切换上下文进行运行 FreeRTOS中的顶半操作和底半操作 顶半操作和底半操作“这种叫法源自与Linux”在嵌入式开发中&#xff0c;为了和Linux操作系统做…