第四周第一天上班

今日任务:

1, 修改日历页面.
2,给首页公告栏增加附件栏.

======================

1,修改日历页面.

按钮堆砌问题

修改CSS: site.css

#tableControll {
    /*width: 30px;*/
    height: 24px;
    float:left;
    margin-left:1px;
    margin-right:1px;
}
第四周第一天上班_第1张图片
最终效果

但在低分辨率下,按钮还是会被挤成上下行..下文会解决..(设定固定宽度)


2, 为首页公告栏增加附件栏

最终效果:


第四周第一天上班_第2张图片
首页公告栏

使用到的 ico图标:
(可惜这里没办法上传ICO图标)

修改2处:
1,首页公告栏
2,点击更多,进入公告搜索列表页

*.cshtml :


      @if (@item.FolderId != null)
       {
           
       }


今天发现一个问题, 如果客户是17寸4:3屏幕, 那屏幕分辨率一般是1024*768px

so, 如果把显示器缩小到这个大小...唉,好多页面都惨不忍睹..

修改日历表格排版

第四周第一天上班_第3张图片
最终效果
1,给table加 table-layout: fixed

2, 设定th固定宽度

        
            
            
            日期
            周次
            出差号
            往返标志
            省份(区域)
            城市(国家)
            工作状态
            相关服务单
            个人备注
        

固定死宽度..这样 页面无论拉大缩小都对它没关系了.


修改首页 个人信息栏

第四周第一天上班_第4张图片
最终效果

虽然依旧挺不好看的....但现在也没有新的idea.

缩小了每个DIV的宽度,删除了几个padding/margin的属性 给姓名\工号等属性值了一个新样式.

.navT{
        font-weight:normal;
    }

修改首页 公告栏, 设置固定宽度.

第四周第一天上班_第5张图片
在1024*768下最终样式

之前是百分比宽度..缩小到1024时, 时间等格子,还是会被挤换行..现在设置成固定宽度后,不会再被挤换行了.


    @**@
    

修改 首页工程经验,设置固定宽度

还是设定固定宽度.低分辨率下,就不会被挤的很难看.

公告发文
发布时间 发布单位 类型 标题(点击查看) 附件 置顶

修改 工程经验页面, 表格设定固定宽度.

第四周第一天上班_第6张图片
最终效果
更新时间 经验编号 问题描述 产品大类 产品小类 经验类别

修改 工程经验页面, 搜索栏重新排版.

1024下的效果

挺费事的...ul li 排列, 内部元素label input排列 问题, 百度了半天..
里面不能有div,我调了半天也没调好.

ProjectExperience.cshtml

    
  • -
  • @Html.DropDownList(" ", ViewData["experiencetKindlist"] as IEnumerable, "--请选择--", new { @class = "announcementscreen", id = "exper_type" })
  • @Html.DropDownList(" ", ViewData["productKindlist"] as IEnumerable, "--请选择--", new { @class = "announcementscreen", id = "exper_bigkinds", @onchange = "GetSmallKindsList(this.value);" })
  • 检索

site.css

/*搜索栏 ul li布局*/
.Search_nvl {
    list-style: none;
    margin: 0px;
    padding: 0px;
/* 两栏之间的间距 */
    -webkit-column-gap: 1px;
    -moz-column-gap: 1px;
    -o-column-gap: 1px;
    column-gap: 1px;
}
.Search_nvl li {
    height: 30px;
    list-style: none;
    line-height: 30px;
    display: inline-block;
}
.Search_nvl li input {
    height: 26px;
    display: inline-block;
    width:200px;
}
.Search_nvl li label {
    padding-left: 20px;
    height: 30px;
    font-size:14px;
    font-weight: bold;
    margin-right: 5px;
    display: inline-block;
}
.Search_nvl li select{
    height: 26px;
    display: inline-block;
    width:200px;
}

你可能感兴趣的:(第四周第一天上班)

更新时间 经验编号 问题描述 产品大类 产品小类 经验类别