Blogger Information
Blog 48
fans 0
comment 0
visits 36388
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
HTML基本标签与CSS选择器-2018年8月10号
雨天的博客
Original
660 people have browsed it

实例

<!DOCTYPE html> <!-- 声明文档类型 -->
<html>
  <head>
    <meta charset="utf-8">
    <!-- 当前页面的编码 -->
    <title>html 第一课作业</title>
    <!-- 网页标题    -->
    <link rel="stylesheet" type="text/css" href="static/css.css"/>
    <!-- 引入外部样式 -->
    <link rel="shortcut icon" type="image/x-icon" href="static/img/favicon.ico">
    <!-- 图标引入 -->
    <style type="text/css">
    /* 内部样式 */
    body{padding: 0;margin: 0;}   /* 标签选择器 */
    .main{margin:10px 15px}.box{width:100px;height:100px;background:red;}
    .mian div{text-align: center;line-height: 100px;color:#FFF;margin: 20px;}
     /*类选择器*/
    #box1{width:100px;height:100px;background:blue;} /*id选择器*/
    a{font-size: 24px;color:#444;}/* 标签选择器 */
    [href="https://www.baidu.com/"]{border: solid 1px #ccc;}/*属性选择器*/
    </style>
  </head>
  <body>
    <div class="main">
      <a href="https://www.baidu.com/">百度</a>
      <p style="color:pink;">内连样式</p> <!-- 内连样式 -->
      <div class="box">box</div>   <!-- 类选择器 -->
      <div id="box1">#box1</div>   <!-- id选择器 -->
      <img src="static/img/img.jpg" alt="">  <!-- 单标签 -->
    </div>
  </body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

下面是手写代码

QQ截图20180813162937.png

QQ截图20180813163107.png

Correction status:qualified

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!