精华内容
下载资源
问答
  • Web前端开发技术(2储久良课后实验材料及源代码
  • (2)加载图像文件名为exp_8_1.jpg (3)定义两个图层,最外层图层包含一个图像和一个子图层,在子图层内采用无序列表显示四行文字 (4)对“央视”“腾讯”“跨界融合 开放共赢”个词采用span标记定义加粗样式 ...

    实验8

    1、利用div及span标记设计如图所示页面,写出实现HTML代码。要求使用链接外部样式表。要求如下:
    (1)编写外部样式表文件,名称为exp_8_1.css,采用链接外部样式表的方法。
    (2)加载图像文件名为exp_8_1.jpg
    (3)定义两个图层,最外层图层包含一个图像和一个子图层,在子图层内采用无序列表显示四行文字
    (4)对“央视”“腾讯”“跨界融合 开放共赢”三个词采用span标记定义加粗样式
    (5)对“联建杯”定义斜体、加粗、大小24px。样式如下:
    .it{font-style: italic;font-size: 24px;font-weight: bold;}
    在这里插入图片描述
    在这里插入图片描述

    效果图
    在这里插入图片描述

    2、按如下要求设计“匾牌设计”页面,如图所示。要求如下:页面标题为“匾牌设计”;页面内容为一个图层中嵌入一个段落,段落内容“海纳百川 有容乃大”;段落的样式为“斜体、特粗、70px大小、行高1.5倍、隶书”;图层div的#div0样式:“宽度800px、高度100px、边框宽度20px、线型outset、颜色#ff0000、填充20px、边距100px”;页面所有内容居中显示(body标记的样式)
    在这里插入图片描述

    效果图
    在这里插入图片描述

    展开全文
  • Web前端开发技术(第3储久良 12.6综合实例 以“十八届中国国际广告节会议注册表”页面为例,其页面效果如图所示。采用11行9列的表格布局来完成页面设计,注册界面使用表单和表单控件来实现。 实现的代码如下...

    以“第十八届中国国际广告节会议注册表”页面为例,其页面效果如图所示。采用11行9列的表格布局来完成页面设计,注册界面使用表单和表单控件来实现。
    图1

    实现的代码如下图所示:

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
        <meta charset="UTF-8">
        <title>第十八届中国国际广告节会议注册表</title>
        <style type="text/css">
            body{text-align:center;}
            h1{font-size: 25px;}
            .zhuce{font-size: 14px;text-align: center;width: 840px;margin: 0 auto;background: #f7f7f7;}
            .zhuce td{border: 1px solid #3300cc;padding: 2px 3px;}
            .zhuce .ibg{text-align: left;}
            .zhuce .bbg{padding: 10px 0; font-size: 13px;}
            #bt{width: 100px;height: 35px;background: #99ffcc;} */
        </style>
    </head>
    <body>
        <h1>第十八届中国国际广告节会议注册表</h1>
        <form>
            <table class="zhuce">
            <tr>
                <td width="100px">参会者姓名</td>
                <td colspan="4" class="ibg" >
                    <input name="txtName" type="text">
                </td>
                <td>职务</td>
                <td colspan="3" class="ibg">
                    <input name="txtZhiwu" type="text">
                </td>
            </tr>
            <tr>
                <td>工作单位</td>
                <td colspan="8" class="ibg">
                    <input name="txtDanwei" type="text" style="width: 500px;">
                </td>
            </tr>
            <tr>
                <td>电话</td>
                <td colspan="2" class="ibg">
                    <input name="txtTel" type="text">
                </td>
                <td>传真</td>
                <td colspan="2">
                    <input name="txtFax" type="text">
                </td>
                <td cilspan="手机"></td>
                <td class="ibg">
                    <input name="txtMobil" type="text">
                </td>
            </tr>
            <tr>
                <td>通讯地址</td>
                <td colspan="6" class="ibg">
                    <input name="txtAddress" type="text" style="width: 400px;">
                </td>
                <td>邮编</td>
                <td class="ibg">
                    <input name="txtPostCode" type="tetx">
                </td>
            </tr>
            <tr>
                <td>E-mail</td>
                <td colspan="6" class="ibg">
                    <input name="txtEmail" type="text" style="width: 180px;">
                </td>
                <td>国家</td>
                <td class="ibg">
                    <select name="ddlCountry" id="ddlCountry" style="width: 180px;">
                        <option value="中国" selected>中国</option>
                        <option value="美国">美国</option>
                        <option value="瑞士">瑞士</option>
                        <option value="印度">印度</option>
                        <option value="巴西">巴西</option>
                </td>
            </tr>
            <tr>
                <td>省份</td>
                <td colspan="6" class="ibg">
                    <select name="ddlProvice" style="width: 180px;">
                        <option value="请选择">请选择</option>
                        <option value="广东省">广东省</option>
                        <option value="上海市">上海市</option>
                        <option value="北京市">北京市</option>
                        <option value="湖南省">湖南省</option>
                </td>
                <td>城市</td>
                <td class="ibg">
                    <input name="txtCity" type="text" style="width: 180px;">
                </td>
            </tr>
            <tr>
                <td colspan="9"><p>会议费标准(人民币)</p></td>
            </tr>
            <tr>
                <td colspan="2">身份 / 时间</td>
                <td colspan="4">2011年9月20日之前注册</td>
                <td colspan="3">2011年9月20日之后注册</td>
            </tr>
            <tr>
                <td colspan="2">中广协会员</td>
                <td colspan="4">
                    <input type="radio" name="rbMem" value="rbMem1">1500元
                </td>
                <td colspan="3">
                    <input type="radio" name="rbMem" value="rbMem2">1800元
                </td>
            </tr>
            <tr>
                <td colspan="2">非会员</td>
                <td colspan="4">
                    <input type="radio" name="rbMem" value="rbMem1">1800元
                </td>
                <td colspan="3">
                    <input type="radio" name="rbMem" value="rbMem2">2000元
                </td>
            </tr>
            <tr>
                <td colspan="9" class="bbg">
                    <input id="bt" type="submit" name="btnOk" value="提交">
                    <input id="bt" type="reset"><br><br>
                    <a href="邀请函和注册表2011.doc">第十八届中国国际广告节会议注册表下载</a>
                </td>
            </tr>
        </table>
        </form>
    </body>
    </html>
    ``
    
    
    展开全文
  • Web前端开发工程师工作内容 Web前端开发工程师工作内容 web前端工程师在不同的公司,会有不同的职能,但称呼都是类似的 做网站设计、网页界面开发 做网页界面开发 做网页界面开发、前台数据绑定和前台逻辑...

    实验7

    1.使用内联样式表及内部样式表,设计7-9所示的页面。设计要求如下:
    (1)使用标题字和段落标记进行文字显示,在内部样式表中定义body标记内信息“居中显示”,定义p标记字体为“隶书”。
    (2)通过怕标记style属性定义字体大小属性(font-size)的值为150%,200%,250%,"朝辞白帝彩云间,"不定义任何任何样式。

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>shi yan 7-1</title>
    <style type="text/css">
    	body{text-align:center;font-family:"隶书"}
    	
    </style>
    </head>
    <body>
    	<h4>早发白帝城</h4>
    	<p>李白</p>
    	<p>朝辞白帝彩云间,</p>
    	<p style="font-size:150%;">千里江陵一日还。</p>
    	<p style="font-size:200%;">两岸猿山啼不住,</p>
    	<p style="font-size:250%">轻舟已过万重山。</p>
    </body>
    </html>
    

    图7-9    古诗排版效果

    2.按如下要求设计“Web前端开发工程师工作内容”页面,设计如图7-10所示的页面。要求如下:
    (1)页面要求为:Web前端开发工程师工作内容;
    (2)页面标题:1 号标题字显示“Web前端开发工程师工作内容”;3号标题字显示“Web前端工程师在不同的公司,会有不同的职能,但称呼都是类似的。”;
    (3)采用无序列表显示工作内容,分四个方面,分别是“做网站设计、网页界面开发”“做网页界面开发”“做网页界面开发、前台数据绑定和前台逻辑的处理”“设计、开发、数据处理”;每一列表显示一种不同风格的工作内容,其中第一列表项ID(li1)样式为“斜体、加粗、24px、黑体”;第二个列表项类(li2)样式为“背景色#9999cc、字符间距1px”;第三个列表项ID(li3)样式为“字体大小18px、颜色红色”;第四列表项行内样式“颜色#0000cc、背景色#c0c0c0、隶书”;
    (4)定义全局样式为“楷体。蓝色”。

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Web前端开发工程师工作内容</title>
    <style type="text/css">
    	#li1{font-style:italic;font-weight:bold;font-size:24px;font-family:黑体;}
    	#li2{background-color:#9999cc;letter-spacing:1px;}
    	#li3{font-size:18px;color:red;}
    	#li4{background-color:#c0c0c0;font-family:隶书;}
    	body{font-family:楷体;color:blue;}
    </style>
    </head>
    <body>
    	<h1>Web前端开发工程师工作内容</h1>
    	<h3>web前端工程师在不同的公司,会有不同的职能,但称呼都是类似的</h3>
    	<ul>
    		<li id="li1">做网站设计、网页界面开发</li>
    		<li id="li2">做网页界面开发</li>
    		<li id="li3">做网页界面开发、前台数据绑定和前台逻辑处理</li>
    		<li id="li4" style="color:#0000cc">设计、开发、数据处理</li>
    	</ul>
    </body>
    </html>
    

    图7-10 Web前端开发工程师工作内容

    展开全文

空空如也

空空如也

1
收藏数 6
精华内容 2
关键字:

web前端开发第三版储久良16.4代码

友情链接: MyBasicPermission.rar