第六章1

最新推荐文章于 2021-05-07 22:51:25 发布
置顶黄昏下的孤独
最新推荐文章于 2021-05-07 22:51:25 发布
阅读量104
点赞数
本文链接：https://blog.csdn.net/qq3144836446/article/details/80766504
版权
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>开班中心信息</title>
    <style>
        h2{
            font-size: 15px;
            color: #FFFFFF;
            border-bottom: 1px #FFFFFF solid;
            text-indent: 2.5em;
            padding: 5px;
            /*font-size: 15px;是字体大小

            color: #FFFFFF;是颜色

            border-bottom设置下边框的样式border-bottom 简写属性把下边框的所有属性设置到一个声明中
            border-bottom-width    规定下边框的宽度。
            border-bottom-style    规定下边框的样式。
            border-bottom-color    规定下边框的颜色。

            text-indent将段落的第一行缩进 2.5 像素：text-indent 属性规定文本块中首行文本的缩进
            length 定义固定的缩进。默认值：0。
            %  定义基于父元素宽度的百分比的缩进。
            inherit    规定应该从父元素继承 text-indent 属性的值。*/

            /*padding 简写属性在一个声明中设置所有内边距属性。
             padding此属性有四个值：
            auto浏览器计算内边距。
            length 规定以具体单位计的内边距值，比如像素、厘米等。默认值是 0px。
            %  规定基于父元素的宽度的百分比的内边距。
            inherit    规定应该从父元素继承内边距。*/
        }
        h2:nth-of-type(1){
            background: url("bg.gif")3px 3px no-repeat;
            /*biv a:nth-of-type(1)将选中第一个p规定属于其父元素的第二个 p 元素的每个 p：
            /*no-repeat :  背景图像在纵向和横向上平铺
            no-repeat :  背景图像不平铺
            repeat-x :  背景图像在横向上平铺
            repeat-y :  背景图像在纵向平铺
            设置或检索对象的背景图像是否及如何铺排。必须先指定对象的背景图像。
            对应的脚本特性为backgroundRepeat。

            text-indent将段落的第一行缩进 2.5 像素：text-indent 属性规定文本块中首行文本的缩进
            length 定义固定的缩进。默认值：0。
            %  定义基于父元素宽度的百分比的缩进。
            inherit    规定应该从父元素继承 text-indent 属性的值。*/
        }
        div{
            width:250px;
            border:1px #17d0ee solid;
            padding:0px 0px 10px 0px;
            background-color: #f4fcfc;
            margin:0px auto;
            background: linear-gradient(to bottom, #03a4ee, #e9fff0);
            border-radius: 20px;
            /*width:250px;

             border 简写属性在一个声明设置所有的边框属性。
             border-width  规定边框的宽度。
             border-style  规定边框的样式。
             border-color  规定边框的颜色。
             inherit   规定应该从父元素继承 border 属性的设置。

             padding 简写属性在一个声明中设置所有内边距属性。
             padding此属性有四个值：
            auto浏览器计算内边距。
            length 规定以具体单位计的内边距值，比如像素、厘米等。默认值是 0px。
            %  规定基于父元素的宽度的百分比的内边距。
            inherit    规定应该从父元素继承内边距。

            background-color 属性设置元素的背景颜色
            color_name 规定颜色值为颜色名称的背景颜色（比如 red）。
            hex_number 规定颜色值为十六进制值的背景颜色（比如 #ff0000）。
            rgb_number 规定颜色值为 rgb 代码的背景颜色（比如 rgb(255,0,0)）。
            transparent    默认。背景颜色为透明。
            inherit    规定应该从父元素继承 background-color 属性的设置。

            margin 属性设置元素的外边距。

           该属性可使用 1 到 4 个值：
           如果规定一个值，比如 div {margin: 50px} - 所有的外边距都是 50 px
           如果规定两个值，比如 div {margin: 50px 10px} - 上下外边距是 50px，左右外边距是 10 px。
           如果规定三个值，比如 div {margin: 50px 10px 20px}- 上外边距是 50 px，而左右外边距是 10 px，下外边距是 20 px。
           如果规定四个值，比如 div {margin: 50px 10px 20px 30px} - 上外边距是 50 px，右外边距是 10 px，下外边距是 20 px，左外边距是 30 px。

            background: linear-gradient(to bottom, #eecd6b, #ffa2f0)颜色渐变属性

            border-radius向 div 元素添加圆角边框： border-radius 属性是一个简写属性，用于设置四个 border-*-radius 属性*/
        }
        div a{
            color: #041807;
            text-decoration: none;
            font-size: 18px;
            list-style: none;
            padding: 10px;
            text-indent: 2px;
            padding-left: 20px;
            /*width数值的高度，height数值的宽度，

            次方法是下划线方法如text-decoration:none 默认。定义标准的文本。
            text-decoration:underline  定义文本下的一条线。
            text-decoration:overline   定义文本上的一条线。
            text-decoration:line-through   定义穿过文本下的一条线
            text-decoration:blink  定义闪烁的文本。

            font-size: 18px;是字体大小属性

            list-style: none该属性是一个简写属性，涵盖了所有其他列表样式属性。由于它应用到所有 display 为 list-item 的元素，所以在普通的 HTML 和 XHTML 中只能用于 li 元素，
            不过实际上它可以应用到任何元素，并由 list-item 元素继承。属性有四个值如：
            list-style-type    设置列表项标记的类型。
            list-style-position    设置在何处放置列表项标记。
            list-style-image   使用图像来替换列表项的标记。
            inherit    规定应该从父元素继承 list-style 属性的值。

            padding此属性有四个值：
            auto浏览器计算内边距。
            length 规定以具体单位计的内边距值，比如像素、厘米等。默认值是 0px。
            %  规定基于父元素的宽度的百分比的内边距。
            inherit    规定应该从父元素继承内边距。

            text-indent 属性规定文本块中首行文本的缩进。
            注释：允许使用负值。如果使用负值，那么首行会被缩进到左边。
            注意：在 CSS 2.1 之前，text-indent 总是继承计算值，而不是声明值。

            padding-left 属性设置元素左内边距（空白）。
            该属性设置元素左内边距的宽度。行内非替换元素上设置的左内边距仅在元素所生成的第一个行内框的左边出现.
            注释：不允许使用负值。*/
        }
        div a:hover{
            color: #ff322e;
            /*div a:hover 选择器用于选择鼠标指针浮动在上面的元素。
            :link 选择器设置指向未被访问页面的链接的样式，
            :visited 选择器用于设置指向已被访问的页面的链接
            :active 选择器用于活动链接。
             提示：:hover 选择器可用于所有元素，不只是链接 color是颜色选择器。
             注释：在 CSS 定义中，:hover 必须位于 :link 和 :visited 之后（如果存在的话），这样样式才能生效。*/
        }
        div a:nth-of-type(1) {   /*biv a:nth-of-type(1)将选中第一个p规定属于其父元素的第二个 p 元素的每个 p：*/
            background: url("nn.gif")30px 30px no-repeat;
            /*no-repeat :  背景图像在纵向和横向上平铺
            no-repeat :  背景图像不平铺
            repeat-x :  背景图像在横向上平铺
            repeat-y :  背景图像在纵向平铺
            设置或检索对象的背景图像是否及如何铺排。必须先指定对象的背景图像。
            对应的脚本特性为backgroundRepeat。*/
        }
        div a:nth-of-type(2){
            background:url("nn.gif")3px 3px no-repeat;
        }
        div a:nth-of-type(3){
            background:url("nn.gif")3px 3px no-repeat;
        }
        div a:nth-of-type(4){
            background:url("nn.gif")3px 3px no-repeat;
        }
        div a:nth-of-type(5){
            background:url("nn.gif")3px 3px no-repeat;
        }
        div a:nth-of-type(6){
            background:url("nn.gif")3px 3px no-repeat;
        }
        div a:nth-of-type(7){
            background:url("nn.gif")3px 3px no-repeat;
        }
    </style>
</head>
<body>
<div>
<h2>中心开班信息</h2>
    <a href="#">8月12日：学历+技能班</a><br>
    <a href="#">8月16日：高考特招班</a><br>
    <a href="#">8月23日：Java精英班</a><br>
    <a href="#">8月31日：学士后强化班</a><br>
    <a href="#">9月5日：大学生就业班</a><br>
    <a href="#">9月9日：企业定向委培班</a><br>
    <a href="#">9月16日：网络营销强化班</a><br>
</div>
</body>
</html>
黄昏下的孤独
关注
0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
第六章1

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;开班中心信息&lt;/title&gt; &lt;style&gt; h2{ font-size
复制链接

扫一扫