HTML----CSSa样式(一)

HTML常用 标签

<html>

<body>

<p><a name="这是文本">这是文本</a></p>
<h1>标题字体一</h1>
<h2>标题字体二</h2>
<h3>标题字体三</h3><hr />
<h4>标题字体四</h4>
<S>删除线</S>
<font size=6 color=#ff0000><h5>标题字体五</h5></font>
<hr align=center size=8 noshade  />
<I>这是斜体</I><em>(这是斜体)</em>
<b>黑体</b><strong>这是黑体</strong>
<tt>打字机字体</tt><var>程序标量X H</var><sub>2</sub>O    
X<sup>2</sup> + Y<sup>2</sup> +2<var>XY</var>
<hr />
<ul>
        <li>第一章</li>
        <li>第二章</li>
           <ol>
                <li>第一节</li>
                     <ul>
                        <li>第一回</li>
                           <dl>
                               <dt>WEB</dt>
                                   <dd>web是英文world wide web的简称,中文意思是布满全球的蜘蛛网</dd>
                           </dl>
                        <li>第二回</li>
                     </ul>
                <li>第二节</li>
           </ol>
        <li>第三章</li>
        <a href="#这是文本">锚点:从这里可以连接到"第一章"文字处</a>
       
</ul>

<p><a name="音频">嵌入音频</a></p>


<embed src="friend.mp3" height="274" width="190"></embed>

 


<hr>

<em>表格</em>
<table border="0" cellpadding="0" cellspacing="0">
     <caption>这是表格标题</caption>
     <tr><th>学号</th><th>姓名</th><th>性别</th></tr>
     <tr><td>01</td><td>lz</td><td>M</td></tr>
     <tr><td>02</td><td>sm</td><td>M</td></tr>
</table>
<hr />

<p>地址标记</p>
<address id="font1">
   地址:广东省东莞市西湖路99号
   电话:122222  
</address>

<hr />
<form>
   <p>这里是表单</p>
   用户名:<input type=text id="username" name=user /><br />
   密码:<input type=password size=8 maxlength=16 />
   <p>一个多行文本框</p>
   <textarea cols=30 rows=20 name=bigtext>
   </textarea>
   <input type="submit" value="提交" />
   <input type="reset" value="重置"  />
   <p>这是单选按钮</p>
   <input type="radio" value=" 音乐" name="x"/>音乐
   <input type="radio" value="电影" name="x" />电影
   <input type="radio" value="小说" name="x"/>小说
   <input type="radio" value="电视" name="x" />电视<br />
   <strong>这是复选框控件</strong><br />
   <input type="checkbox"value="北京" name="Beijing"  />北京
   <input type="checkbox"value="上海" name="Shanghai" />上海
   <input type="checkbox"value="广州" name="guangzhou" checked />广州
   <input type="checkbox"value="天津" name="tianjin" checked />天津
  
   <h1>下拉菜单</h1>
   <u>下来菜单任选一个</u>
   <select name=x1>
           <option>apple</option>
           <option>bear</option>
           <option>banana</option>
           <option>pine-apple</option>
   </select>
    <br />
    <br />
    <br />
    <br />
    <hr />
    <h3>滚动菜单可以多选</h3>
    <select multiple name=x1 size=2>
           <option>apple</option>
           <option>bear</option>
           <option>banana</option>
           <option>pine-apple</option>
    </select> 
</form>
  <hr />
    <h3><strong>会滚动的字体标志</strong></h3>
    <marquee>自由移动</marquee><hr />
    <marquee direction=left>从左向右移动</marquee><hr />
    <hr />
    <marquee direction=up>从下向上移动</marquee>
    <hr />
    <marquee direction=down>从上往下移动</marquee>
    <hr />
    <marquee direction=right>从右向左移动</marquee><hr />
    <marquee behavior=scroll>一圈一圈绕着滚动</marquee><hr />
    <marquee behavior=slide>滚动一次就停了</marquee><hr />
    <marquee loop=4 width=50% behavior=scroll>滚动四次</marquee>
    <marquee scrollamount=40>快速滚动</marquee>
    <font size=5>
    <marquee scrollamount=100 scrolldelay=500 direction=right>滚动一步,停一停</marquee>
    <marquee align=#  width=500  direction=right>字幕的宽度</marquee>
    </font>
    <hr />
    <marquee height=50 width=40% bgcolor=aaeeaa>滚动字幕高宽度和背景颜色</marquee>
    <hr />
    <hr />
    <hr />
    <hr />
    <hr />
    <em>地图标志</em>
    <img src="image/Desert.jpg" usemap="#Face" />
    <map name="Face">
    <area shape=circle href=Default.aspx coords="10,14,125" />
    <area shape=rect href=XMLFile.xml coords=55,75,353,455 />
    </map>
    <hr />
    <%!---------注释-------IE不支持--- %>
    <U>闪烁的字体</U>
    <blink>我闪我闪,闪到你头晕,闪到你目眩</blink>
    <strong>&copy</strong>
    <strong>&reg</strong>
</body>
</html>
 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
网站 首先,我们需要确定网站的整体布局和设计风格。我们可以选择一个简洁、清晰、易于导航的设计风格,以帮助学生快速找到他们需要的信息。 接下来,我们可以使用HTML和CSS来创建布局和样式。我们可以使用以下代码来创建网站的基本结构: ```html <!DOCTYPE html> <html> <head> <title>课程学习网站</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <header> <h1>课程学习网站</h1> <nav> <ul> <li><a href="#">首页</a></li> <li><a href="#">课程介绍</a></li> <li><a href="#">学习资源</a></li> <li><a href="#">联系我们</a></li> </ul> </nav> </header> <main> <section> <h2>课程介绍</h2> <p>这里是课程介绍的内容。</p> </section> <section> <h2>学习资源</h2> <p>这里是学习资源的内容。</p> </section> </main> <footer> <p>版权所有 © 2021 课程学习网站</p> </footer> </body> </html> ``` 在上面的代码中,我们使用了HTML5的语法来创建网站的基本结构,包括标题、导航、主要内容和页脚。我们还使用CSS来定义样式,该样式将在`style.css`文件中定义。 接下来,我们可以使用CSS来定义网站的样式,例如背景颜色、字体、文本颜色、边框等。以下是一个例子: ```css body { background-color: #f0f0f0; font-family: Arial, sans-serif; color: #333; } header { background-color: #333; color: #fff; padding: 20px; } nav ul { list-style: none; margin: 0; padding: 0; } nav li { display: inline-block; margin-right: 20px; } nav a { color: #fff; text-decoration: none; } main { margin: 20px; } section { margin-bottom: 20px; padding: 20px; background-color: #fff; border: 1px solid #ccc; } footer { background-color: #ddd; padding: 20px; text-align: center; } ``` 在上面的CSS代码中,我们定义了网站的样式,包括背景颜色、字体、文本颜色、边框、填充和其他样式。我们还使用了CSS选择器来定义各种元素的样式,例如`body`、`header`、`nav`、`ul`、`li`、`a`、`main`、`section`和`footer`。 最后,我们可以使用JavaScript来添加交互性和动态功能,例如表单验证、动画效果、图像轮播等。使用JavaScript可以使网站更加生动、有趣和易于使用,同时可以提高用户体验。 总之,使用HTML、CSS和JavaScript可以创建一个美观、易于导航、功能强大的课程学习网站,帮助学生更好地学习和掌握知识。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值