zoukankan      html  css  js  c++  java
  • 第12课:HTML+CSS的基础用法

    1. html之head部分的常用标签的使用

    <!--指定html是标准的html还是其它的html-->
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <!--自闭合标签:没有另一半,自动闭合-->
        <!--主动闭合标签:有另一半的-->
        <!--header当中,大部分标签是在页面中看不到的-->
        <meta charset="UTF-8">
        <!--页面每隔1秒自动刷新-->
        <!--间隔x秒自动刷新,跳转到指定的URL-->
        <!--<meta http-equiv="refresh" content="1;url='http://www.baidu.com'">-->
        <!--关键字检索:在搜索引擎上通过关键检索时根据你的网站的keywords能把你的网站检索出来-->
        <meta name="keywords" content="python">
        <!--网站描述-->
        <meta name="description" content="基础教程">
    
        <!--浏览器tag的名字-->
        <title>我的第一个html页面</title>
        <!--网页tag标签的图标,图片需要是32*32大小的,需要ui做图-->
        <link rel="shortcut icon" href="1.jpg">
    
        <!--欠着的-->
        <!--<link rel="stylesheet" href="">-->
        <!--<style></style>-->
        <!--<script></script>-->
    </head>
    <body>
    <h1>111111111111</h1>
    1111111111
    </body>
    </html>
    

    2. html之body部分的常用标签的使用

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <!--body里放的是能展示的标签-->
    
    <!--标题标签-->
    <!--<h1>111111</h1>-->
    <!--<h2>2</h2>-->
    <!--<h3>3</h3>-->
    <!--<h4>4</h4>-->
    <!--<h5>5</h5>-->
    <!--<h6>6</h6>-->
    
    <!--白板标签:没有任何css样式-->
    <!--内联标签(行内标签):真白版标签,有多大占多大-->
    <!--<span>这是span标签</span>-->
    <!--这是写在标签外面的内容-->
    <!--块级标签:伪白板标签,无论多大都占一行-->
    <!--<div>这是div标签</div>-->
    
    <!--段落标签-->
    <!--<p>在UI自动化测试过程中,经常会遇到一些下拉框,我们有三种可选方式来操作下拉框。 第一种方法<br>-->
        <!--基于webdriver的两次click,很容易出现问题,不建议使用。(由于部分下拉在UI自动化测试过程中,经常会遇到一些下拉框,我们有三种可选方式来操作下拉框。 第一种方法-->
        <!--基于webdriver的两次click,很容易出现问题,不建议使用。(由于部分下拉在UI自动化测试过程中,经常会遇到一些下拉框,我们有三种可选方式来操作下拉框。 第一种方法-->
        <!--基于webdriver的两次click,很容易出现问题,不建议使用。(由于部分下拉在UI自动化测试过程中,经常会遇到一些下拉框,我们有三种可选方式来操作下拉框。 第一种方法-->
        <!--基于webdriver的两次click,很容易出现问题,不建议使用。(由于部分下拉在UI自动化测试过程中,经常会遇到一些下拉框,我们有三种可选方式来操作下拉框。 第一种方法-->
        <!--基于webdriver的两次click,很容易出现问题,不建议使用。(由于部分下拉在UI自动化测试过程中,经常会遇到一些下拉框,我们有三种可选方式来操作下拉框。 第一种方法-->
        <!--基于webdriver的两次click,很容易出现问题,不建议使用。(由于部分下拉在UI自动化测试过程中,经常会遇到一些下拉框,我们有三种可选方式来操作下拉框。 第一种方法-->
        <!--基于webdriver的两次click,很容易出现问题,不建议使用。-->
    <!--</p>-->
    
    <!--输入框标签: input-->
    <!--输入框中的默认值,有两种实现方式-->
    <!--<input type="text" name="" value="请输入用户名">-->
    <!--<input type="text" name="" value="" placeholder="请输入用户名">-->
    <!--如果接口要求json格式的,则前端以key:value的形式传参给后台,即name:value {'username': 'dsx'},value取的是文本框中输入的值-->
    <!--<input type="text" name="username" value="" placeholder="请输入用户名">-->
    <!--密码框-->
    <!--<input type="password" name="passwd">-->
    <!--多选框 checked="checked"默认勾选-->
    <!--多值向后台传参时:{'sex':['1','2', '3']}-->
    <!--<input type="checkbox" name="" checked="checked">-->
    <!--单选框:radio标签,name相同,单选框互斥-->
    <!--<div>-->
        <!--<span>男</span><input type="radio" name="sex">-->
    <!--</div>-->
    <!--<div>-->
        <!--<span>女</span><input type="radio" name="sex">-->
    <!--</div>-->
    <!--button按钮只是一个按钮,没有任何其它附加操作;-->
    <!--submit按钮和form表单连用,会把form表单中的数据提交给后台。所以会出现点击form表单中的submit按钮页面刷新-->
    <!--form表单中:action的值是跳转到哪个页面;请求的接口;method:请求方式-->
    <!--form表单提交会刷新页面,ajax提交不会刷新页面,只提交数据-->
    <!--<form action="head.html" method="post">-->
        <!--<input type="text" value="默认值">-->
        <!--<!–input标签type属性是button或submit时,是没有name属性的–>-->
        <!--<!–没有任何附加操作,日常使用中,会添加onclick事件,会使用到ajax–>-->
        <!--<input type="button" value="增加">-->
        <!--<input type="submit" value="提交">-->
        <!--<input type="reset" >-->
    <!--</form>-->
    
    <input name="username" value="1234" type="text">
    </body>
    </html>
  • 相关阅读:
    Win10解决RuntimeBroker.exe后台运行CPU占比高的方法
    easyexcel测试用例
    电脑Wlan不能上网的解决办法
    [LeetCode] Delete and Earn 删除与赚取
    [LeetCode] Daily Temperatures 日常温度
    [LeetCode] 738. Monotone Increasing Digits 单调递增数字
    [LeetCode] 737. Sentence Similarity II 句子相似度之二
    [LeetCode] Parse Lisp Expression 解析Lisp表达式
    [LeetCode] Asteroid Collision 行星碰撞
    [LeetCode] 644. Maximum Average Subarray II 子数组的最大平均值之二
  • 原文地址:https://www.cnblogs.com/qiezizi/p/8659158.html
Copyright © 2011-2022 走看看