11.12日 超链接
内部外部链接
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>超连接</title>
</head>
<body>
<a href="https://www.xuexi.cn/" >学习强国</a><br>
<a href="https://www.xuexi.cn/" target="_parent">学习强国</a><br>
<a href="https://www.xuexi.cn/" target="_blank">学习强国</a><br>
<a href="绿叶学习网.html" target="_blank">绿叶学习网</a>
</body>
</html>
锚点链接
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>锚点链接</title>
<style type="text/css">
#p1{font-size: 30px;}
</style>
</head>
<body>
<div>
<p id="p3"><a href="#p2">跳转到页底</a> </p>
</div>
<p id="p1"> 武汉科技大学是湖北省人民政府和教育部共建的地方高水平大学、国家国防科技工业局与湖北省人民政府共建高校、湖北省“国内一流大学建设高校”,入选教育部“深化创新创业教育改革示范高校”“高等学校科技成果转化和技术转移基地”、科技部“创新人才培养示范基地”、国家知识产权局“知识产权试点高校”和湖北省“双创示范基地”“大学生创业示范基地”。</p>
<br>
<p id="p1"> 学校办学历史溯源于1898年清末湖广总督张之洞奏请清朝政府批准成立的工艺学堂,历经湖北中等工业学堂、中南钢铁工业学校等传承与发展,1958年组建为武汉钢铁学院,开办本科教育。1995年隶属于原冶金工业部的武汉钢铁学院、武汉建筑高等专科学校、武汉冶金医学高等专科学校合并组建为武汉冶金科技大学。1998年根据国家高等教育管理体制改革需要,成为第一批实行“中央与地方共建,以湖北省人民政府管理为主”的划转院校。1999年更名为武汉科技大学。百余年来,学校为国家和社会培养了各类专门人才25余万人。一大批杰出校友成长为院士、专家学者、党政领导、大型钢铁企业掌门人,学校被誉为“冶金高层次人才的摇篮”。</p>
<br>
<p id="p1"> 学校现有青山、黄家湖和洪山三个校区,校园总面积171.43万平方米,校舍建筑面积129万平方米。固定资产32.50亿元;教学科研仪器设备总值7.96亿元;图书馆馆藏纸质图书283.31万册,电子图书102.42万册。全日制普通本科生25000余人,博士、硕士研究生9500余人。校园依湖览江、风景优美,教学设施齐备,办学条件完善,是“湖北省生态园林式学校”“全国绿化模范单位”。</p>
<br>
<p id="p1"> 学校学科门类齐全、特色鲜明,构建了以工为主、理工结合,工、理、管、医、文、经、法、哲、艺、教等学科协调发展的综合性大学学科体系。设置有18个学院(部)、79个本科专业;拥有8个博士后科研流动站,8个一级学科博士学位授权点和40个二级学科博士学位授权点、33个一级学科硕士学位授权点和174个二级学科硕士学位授权点、20个硕士专业学位类别。建有1个国家重点(培育)学科、10个省级重点学科,5个省级重点(培育)学科,6个省级优势特色学科群。材料科学与工程、冶金与矿业工程、机械工程等3个学科入选湖北省“国内一流学科”建设学科;材料科学与工程学科入选湖北省一流学科重点建设学科;材料科学、工程学、化学、临床医学、计算机科学等5个学科进入ESI全球排名前1%。</p>
<br>
<p id="p1"> 学校坚持深化教育教学改革,获批“双万计划”一流本科专业建设点40个(其中国家级28个),国家级特色专业、“卓越工程师教育培养计划”等国家级专业建设项目14项,16个本科专业通过教育部专业认证(评估)。获批国家级一流本科课程16门,国家规划教材14部,国家级实验教学示范中心、虚拟仿真实验教学中心等实践教学平台7个。获国家级教学成果奖6项(其中一等奖1项)。获批国家级新工科研究与实践项目3项,国家级新文科研究与改革实践项目1项。毕业生平均就业率保持在95%以上。学生多次荣获“互联网+”、“挑战杯”和全国大学生电子设计竞赛、大学生机械创新设计大赛、大学生智能汽车竞赛、大学生电子商务“创新、创意及创业”挑战赛等高水平竞赛大奖。“十三五”以来,学生参加各类学科和科技竞赛累计获得国际级、国家级奖励4500余项;学校在中国高等教育学会发布的“2022年全国普通高校学科竞赛评估结果”中排名第47位。学校女篮在全国享有盛名,多次获得全国大运会、CUBA和CUBS冠军,培养了10多位国家队、国青队队员。</p>
<br>
<p id="p1"> 学校科研实力雄厚,建有湖北省属高校第一个国家重点实验室——“省部共建耐火材料与冶金国家重点实验室”、湖北省属高校第一个国家工程研究中心——“高温材料与炉衬技术国家地方联合工程研究中心”、湖北省属高校第一个生态环境部重点实验室——“国家环境保护矿冶资源利用与污染控制重点实验室”和2个国家级协同创新中心——“高性能钢铁材料及其应用省部共建协同创新中心”“战略钒资源利用省部共建协同创新中心”;拥有2个教育部重点实验室、1个教育部(B类)重点实验室、1个教育部工程研究中心,1个国家级协同创新中心(联合)、29个省级科研平台。“十三五”以来,学校主持和承担国家重点研发计划、国家自然科学基金、国家社会科学基金等国家级项目530多项,获得省部级及以上科技(社科)成果奖190余项。2007年以来获得19项国家科技成果奖(国家科技进步一等奖1项、二等奖13项,国家技术发明二等奖5项)。</p>
<br>
<p id="p1"> 学校积极实施人才强校战略,现有教职工2700余人,其中专任教师1900余人。拥有全职及双聘院士5人、俄罗斯工程院外籍院士1人,国家重要人才计划入选者22人,全国高等学校教学名师1人,全国模范教师2人,全国优秀教师5人,全国高校黄大年式教师团队1个,国家级教学团队3个,国家及湖北省新世纪百千万人才入选者30人,湖北省人才引进计划入选者291人,湖北省公共卫生领军人才培养计划入选者1人,湖北省青年拔尖人才培养计划入选者4人,湖北名师15人,湖北名师工作室8个,宝钢教育基金优秀教师37人,省部级有突出贡献中青年专家33人,享受国务院和湖北省人民政府特殊津贴85人,获“霍英东青年教师奖”5人。“海洋工程用钢及应用性能学科创新引智基地”入选教育部和国家外国专家局联合组织实施的“高等学校学科创新引智计划”;“先进耐火材料学科创新引智基地”“混合智能引智创新示范基地”入选湖北省引智创新示范基地。</p>
<br>
<p id="p2"><a href="#p3">跳转到页顶</a> </p>
</body>
</html>
11.13日 标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>form标签</title>
</head>
<body>
<form>
<input type="text" value="这是一个单行文本框"/><br>
<textarea>这是一个单行文本框</textarea><br/>
<select>
<option>HTML</option>
<option>CSS</option>
<option>JavaScript</option>
</select>
</form>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>input标签</title>
</head>
<body>
<form method="post">
姓名:<input type="text"/><br>
密码:<input type="password"/><br>
性别:
<input type="radio" name="gender" value="男"/>男
<input type="radio" name="gender" value="女"/>女<br>
你喜欢的水果:<br/>
<input type="checkbox" name="fruit" value="苹果"/>苹果
<input type="checkbox" name="fruit" value="香蕉"/>香蕉
<input type="checkbox" name="fruit" value="西瓜"/>西瓜
<input type="checkbox" name="fruit" value="李子"/>李子<br>
<input type="button" value="表白">
</form>
</body>
</html>
11.14日练习
框架
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>框架</title>
</head>
<body>
<iframe src="https://www.xuexi.cn/" width="1000" height="800"></iframe>
</body>
</html>
字体样式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>字体样式</title>
<style type="text/css">
#div1{font-family:Arial;}
#div2{font-family:"Time New Roman";}
#div3{font-family:"微软雅黑";}
#div1{font-size:50px;}
#div2{font-size:100px;}
#div3{font-size:150px;}
#div1{font-weight:400;}
#div2{font-weight:700;}
#div3{font-weight:900;}
#div1{font-style:normal;}
#div2{font-style:italic;}
#div3{font-style:oblique;}
#div1{color:gray;}
#div2{color:orange;}
#div3{color:red;}
</style>
</head>
<body>
<div id="div1">Arial</div>
<div id="div2">Time New Roman</div>
<div id="div3">微软雅黑</div>
</body>
11.15日练习 文本样式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>文本样式</title>
<style type="text/css">
#h1{font-size: 14px;}
.h1 {
text-align: left;/*水平对齐*/
text-decoration:text-underline;/*划线效果*/
line-height: 15px;/*行高*/
letter-spacing: 3px;
}
.h2{
font-size: 28px;
text-align: left;/*水平对齐*/
text-decoration:text-underline;/*划线效果*/
line-height: 25px;/*行高*/
letter-spacing: 5px;
}
p{
text-indent: 28px;
font-size:14;
}
#p1{text-transform: uppercase;}/*转换为大写*/
#p2{text-transform:capitalize;}/*每个单词首字母为大写*/
#px{word-spacing: 3px;}
#p2{word-spacing: 5px;}
</style>
</head>
<body>
<h3>岳阳楼记</h3>
<p class="h1">庆历四年春,滕子京谪守巴陵郡。越明年,政通人和,百废具兴。乃重修岳阳楼,增其旧制,刻唐贤今人诗赋于其上。属予作文以记之。
<p class="h1">予观夫巴陵胜状,在洞庭一湖。衔远山,吞长江,浩浩汤汤,横无际涯;朝晖夕阴,气象万千。此则岳阳楼之大观也,前人之述备矣。然则北通巫峡,南极潇湘,迁客骚人,多会于此,览物之情,得无异乎?</p>
<p class="h1">若夫淫雨霏霏,连月不开,阴风怒号,浊浪排空;日星隐曜,山岳潜形;商旅不行,樯倾楫摧;薄暮冥冥,虎啸猿啼。登斯楼也,则有去国怀乡,忧谗畏讥,满目萧然,感极而悲者矣。</p>
<p class="h1">至若春和景明,波澜不惊,上下天光,一碧万顷;沙鸥翔集,锦鳞游泳;岸芷汀兰,郁郁青青。而或长烟一空,皓月千里,浮光跃金,静影沉璧,渔歌互答,此乐何极!登斯楼也,则有心旷神怡,宠辱偕忘,把酒临风,其喜洋洋者矣。</p>
<p class="h1">嗟夫!予尝求古仁人之心,或异二者之为。何哉?不以物喜,不以己悲;居庙堂之高则忧其民;处江湖之远则忧其君。是进亦忧,退亦忧。然则何时而乐耶?其必曰:“先天下之忧而忧,后天下之乐而乐”乎。噫!微斯人,吾谁与归?</p>
<p class="h1">时六年九月十五日。</p>
<h3>爱莲说</h3>
<p class="h2">水陆草木之花,可爱者甚蕃。晋陶渊明独爱菊。自李唐来,世人甚爱牡丹。予独爱莲之出淤泥而不染,濯清涟而不妖,中通外直,不蔓不枝,香远益清,亭亭净植,可远观而不可亵玩焉。</p>
<p class="h2">予谓菊,花之隐逸者也;牡丹,花之富贵者也;莲,花之君子者也。噫!菊之爱,陶后鲜有闻。莲之爱,同予者何人?牡丹之爱,宜乎众矣!</p>
<p id="p1">room was built in a day.</p>
<p id="p2">room was built in a day.</p>
</body>
</html>
11.16
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>边框</title>
<style type="text/css">
div
{
width:100px;
height:30px;
}
#d1
{
border-width:1px;
border-style:dashed ;
border-color: red;
}/*div{border:1px dashed red;}*/
#d2
{
border-width:1px;
border-style:solid ;
border-color: purple;
}
img
{
border-width: 10px;
border-style: solid;
border-color: red;
}
#d3
{
width:100px;
height:60px;
border-top: 2px solid red;
border-right: 5px dashed yellow;
border-bottom: 10px solid blue;
border-left: 15px dashed green;
}
</style>
</head>
<body>
<div id="d1"></div><br>
<div id="d2"></div><br>
<div id="d3"></div><br>
<img src="C:\Users\123456\Desktop\d.png.jpg" width="30%" height="30%">
</body>
</html>
11.17日练习
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>列表样式</title>
<style type="text/css">
#o1{list-style-type:lower-roman;}
#u1{list-style-type: circle;}
#o2,#u2{list-style-type: none;}
</style>
</head>
<body>
<h3>有序列表</h3>
<ol id="o1">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ol>
<h3>无序列表</h3>
<ul id="u1">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<h3>有序列表</h3>
<ol id="o2">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ol>
<h3>无序列表</h3>
<ul id="u2">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</body>
</html>