HTML学习笔记



  
<html lang="zh"> 

<head> 
    <meta charset="utf-8">  
    <title>学习笔记title>  
head>

<body> 

<h1>我的第一个标题,h1到h6h1>
<p>我的第一个段落。p>
<br> 
<hr> 

<a href="https://www.csdn.net">这是一个链接 www.csdn.neta>
<br><br>

<img loading="lazy"
     src="https://img.pconline.com.cn/images/upload/upc/tx/photoblog/1107/19/c2/8373140_8373140_1311046320283.jpg"
     width="258" height="200" alt="这是一个图片"/>
<br><br>



<h4>表格:h4>
<table>
    <caption>My Tablecaption>
    <tr>
        <th>firstth>
        <th>secondth>
        <th>thirdth>
    tr>
    <tr>
        <td>100td>
        <td>200td>
        <td>300td>
    tr>
    <tr>
        <td>400td>
        <td>500td>
        <td>600td>
    tr>
table>

<h4>无序列表:h4>
<ul>
    <li>Coffeeli>
    <li>Teali>
    <li>Milkli>
ul>

<h4>有序列表:h4>
<ol>
    <li>Coffeeli>
    <li>Teali>
    <li>Milkli>
ol>

<h4>自定义列表:h4>
<dl>
    <dt>Coffeedt>
    <dd>- black hot drinkdd>
    <dt>Milkdt>
    <dd>- white cold drinkdd>
dl>

<h4>表单:h4>
<form name="input" action="html_form_action.php" method="get">
    <fieldset>
        <legend>Personal information:legend>
        <label>
            First name: <input type="text" name="firstname">
        label>
        <br>
        <label>
            Last name: <input type="text" name="lastname">
        label>
        <br>
        <label>
            Password: <input type="password" name="password">
        label>
        <br>
        <label>
            <input type="radio" name="sex" value="male"> Male
        label>
        <br>
        <label>
            <input type="radio" name="sex" value="female"> Female
        label>
        <br>
        <label>
            <input type="checkbox" name="vehicle" value="Bike">I have a bike
        label>
        <br>
        <label>
            <input type="checkbox" name="vehicle" value="Car">I have a car
        label>
        <br>
        <label>
            <select name="cars">
                <option value="volvo">Volvooption>
                <option value="saab">Saaboption>
                <option value="fiat" selected>Fiatoption>
                <option value="audi">Audioption>
            select>
        label>
        <br>
        <label>
            <textarea name="desc" rows="5" cols="30">我是一个文本框。textarea>
        label>
        <br>
        <input type="submit" value="提交">
        <input type="reset" value="重置">
    fieldset>
form>
<br>

<h4>脚本:h4>
<noscript>抱歉,你的浏览器不支持 JavaScript!noscript>

<script>
    document.write("Hello World!");
script>
<br>

<p id="demo"> JavaScript 可以触发事件,就像按钮点击。 p>

<script>
    function myFunction() {
        document.getElementById("demo").innerHTML = "Hello JavaScript!";
    }

    function myFunction2() {
        x = document.getElementById("demo"); // 找到元素
        x.style.color = "#ff0000";          // 改变样式
    }
script>

<br>

<button type="button" onclick="myFunction()">点我button>
<button type="button" onclick="myFunction2()">点击这里button>

body>
html>

你可能感兴趣的:(编程,html)