HTML,CSS,JS基础

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>基础</title>

<!-- <style>

    h1{

        color:brown;

       

    }

</style> -->

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

<!-- <script>

    alert('Hello JS')

</script> -->

<!-- <script src="js/dome.js"></script> -->




 

</head>

<script>

    // var img=document.getElementById('h2');

    // alert(img);

   

    // var divs=document.getElementsByTagName('div');

    // for(let i=0;i<divs.length;i++){

    //     alert(divs[i]);

    // }

   

    // var ins=document.getElementsByName('hobby');

    // for(let i=0;i<ins.length;i++){

    //     alert(ins[i]);

    // }

   

    // var disv=document.getElementsByClassName('cls');

    // for (let i = 0; i < disv.length; i++) {

    //     alert(disv[i]);

       

    // }

    // var disv=document.getElementsByClassName('cls');

    // var div1=disv[0];

    // div1.innerHTML="智博桀骜";

   

    // var img=document.getElementById('h2');

    // img.src="img/2.jpg";

   

    // var divs=document.getElementsByTagName('div');

    // for(let i=0;i<divs.length;i++){

    //     const div=divs[i];

    //     div.innerHTML+="<font color='red'>113</font>";

   

    // var ins=document.getElementsByName('hobby');

    // for(let i=0;i<ins.length;i++){

    //     const check=ins[i];

    // check.checked=true;

   

    // }

    // }

    // function on(){

    //     alert("我被点击了")

    // }

   

    // document.getElementById('but1').οnclick=function(){

    //     alert("被点击");

    // }

function on(){

var img=document.getElementById("h2");

img.src="img/2.jpg";


 

}

    function off(){

        var img=document.getElementById("h2");

img.src="img/1.jpg";

    }


 

function lower(){

var input=document.getElementById("name");

input.value=input.value.toLowerCase();

}

function upper(){

    var input=document.getElementById("name");

input.value=input.value.toUpperCase();

}

function checkAll(){

    var hobbys=document.getElementsByName("hobby1");

for (let i = 0; i < hobbys.length; i++) {

    const element = hobbys[i];

    element.checked=true

}}

function reverse(){

    var hobbys=document.getElementsByName("hobby1");

for (let i = 0; i < hobbys.length; i++) {

    const element = hobbys[i];

    element.checked=false;

}

}





 

   

   

   

   

    </script>

<body>

<img id="h2" src="img/1.jpg"><br><br>

<input type="button" value="换1" οnclick="on()">

<input type="button" value="换2"οnclick="off()">

<br><br>

<!-- <div class="cls">传智</div>

<div class="cls">智博</div> -->

<input type="text" id="name" value="ITCAST" οnfοcus="lower()" οnblur="upper()">

<br><br>




 

<input type="checkbox" name="hobby1">电影

<input type="checkbox" name="hobby1">游戏

<input type="checkbox" name="hobby1">旅游

<br><br>

<input type="button" value="全选" οnclick="checkAll()">

<input type="button" value="不选"οnclick="reverse()">







 

<form action="" method="get">

用户名:<input type="text" name="username"><br><br>

密码:<input type="password" name="password"><br><br>

年龄:<input type="text" name="age"><br><br>

性别:<label><input type="radio" name="gender" value="1">男</label>

      <label><input type="radio" name="gender" value="2">女</label><br><br>

爱好:<label><input type="checkbox" name="hobby" value="java">java1</label>

<label><input type="checkbox" name="hobby" value="java">java2</label>

<label><input type="checkbox" name="hobby" value="java">java3</label><br><br>

图像;<input type="file" name="image"><br><br>

生日:<input type="date" name="birthday"><br><br>

时间:<input type="time" name="time"><br><br>

日期时间:<input type="datetime-local"name="datetime"><br><br>

邮箱:<input type="email" name="email"><br><br>

年龄:<input type="number" name="age"><br><br>

学历:<select name="degree">

<option value="">   </option>

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

</select><br><br>

描述:<textarea name="description" cols="30" rows="10"></textarea><br><br>

<input type="hidden" name="id" value="1">



 

<input type="button" id="btn1" value="按钮">

<input type="reset" οnclick="on()" id="btn2"  value="重置">

<input type="submit"id="btn3" value="提交"><br><br>

</form>

    <div

    id="center"

    >

    <img src="img/1.jpg" width="100"height="14"/> <a href="http://gov.sina.com.cn/" target="_self">樱桃</a> > 正文

    <h1>不负重托办好学校思想政治理论课</h1>

    <!-- <h1 style="color: brown;">不负重托办好学校思想政治理论课</h1> -->

    <hr>

    <span class="time">2024年03月18日 11:46</span>

    <span id="cls"><a href="https://wap.peopleapp.com/article/7371300/7204708" target="_blank">人民日报</a> </span>

    <hr>

<video src="./video/电脑快捷键录屏_百度搜索 -联想浏览器 2024-03-18 16-20-04.mp4" controls="controls" width="850"></video>

<!-- <audio src="./audio/3508909346.mp3" controls="controls"></audio> -->

<br>

“办好思政课,是我非常关心的一件事。”

<br>

  <p>2024年3月18日,<b>北京</b>见证了一堂特殊而难忘的思政课——以高远的历史站位、宽广的国际视野、深邃的战略眼光,深刻回答了培养什么人、怎样培养人、为谁培养人的根本问题,为推进新时代学校思想政治教育创新发展指明了方向、提供了遵循。</p>

<br>

<p> <strong>5年来</strong>,在机制建设、师资配置、课程设计、资源整合等方面深化改革创新,探寻提高思政课吸引力的根本路径,擎信仰之炬,育时代新人。</p>

<img src="img/2.jpg"/>

<br>

  <p><b>北京</b>见证了一堂特殊而难忘的思政课11111111111111111111111111111111111111111111111111111111111</p>

<table border="1pz" width="600px" cellspacing="0">

<tr>

    <th>1</th>

    <th>1</th>

    <th>1</th>

</tr>

<tr>

    <td><img src="./img/4.jpg" width="100px"/></td>

    <td>2</td>

    <td>2</td>

</tr>

<tr>

    <td><img src="./img/4.jpg"width="100px"/></td>

    <td>2</td>

    <td>2</td>

</tr>

</table>

<br>

<img src="img/3.jpg"/>

<p>  上海交通大学马克思主义学院与中国商飞公司民用飞机试飞中心签署共建协议,成立“大思政课”实践教学基地,将“大思政课”开到了“大飞机”上;甘肃省定西市陇西县渭州学校与20多个校外社会实践基地合作,带领学生体验非遗扎染、参观中药材“百草园”……思政小课堂同社会大课堂有益结合,育人主体和渠道不断丰富。</p>

<p id="plast">责任编辑:2222 SN242</p>

</div>

<!-- <script>

    var a=10;

    a="张三";

    alert(a);

</script> -->



 

</body>

</html>

-------------------------------------------------------------------------------------

// alert('Hello JS')

// // document.write('Hello JS')

// console.log('Hello js')

// function add(a,b){

//     return a+b;

// }

// var result=add(10,20);

// alert(result);

// var arr=new Array(1,2,3,4);

// console.log(arr[0]);

// // for (let i = 0; i < arr.length; i++) {

// //     console.log(arr[i]);

   

// // }

// arr.forEach((e) => {

//     console.log(e);

// });

// var str="  Hello String  ";

// console.log(str);

// console.log(str.length);

// console.log(str.charAt(3));

// console.log(str.indexOf("lo"));

// var s=str.trim();

// console.log(s);

// console.log(str.substring(5,7));

// var user={

//     name:"A",

//     age:10,

//     gender:"male",

//     eat:function(){

//         alert("用膳~")

//     }

// }

// alert(user.name);

// user.eat();

// var jsonStr='{"name":"A","age":10,"gender":"male","addr":["北京","上海"]}';

// var jsObject=JSON.parse(jsonStr);

// alert(jsObject.name);

// alert(JSON.stringify(jsObject));


 

// var flag=confirm("确认删除吗?");

// alert(flag);

------------------------------------------------------

h1{

    /* color:blue; */

    /* color: rgb(0, 255,0); */

    color: #45454d;

}

.time{

    color: #9c9caa;

    font-size: 12px;

}

#cls{

    color: rgb(15, 16, 16);

}

a{

    color: black;

    text-decoration: none;

}

p{

    text-indent: 35px;

    line-height: 35px;

}

#plast{

text-align: right;

}

#center{

    width: 65%;

/* margin:0% 17.5% 0% 17.5%; */

margin: 0 auto;

}

  • 3
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值