Adjust the content of CSS dedecms in the two boxes on the website homepage

Environment: win7 apmserv5.2.6 dedecms5.7sp1 GBK version

 

The problem is as follows:

Want to put,

Adjusted:

Find the code for the two boxes in index.htm. The Code is as follows:

<Div class = "tabbox">

<Div class = "HD">

<Ul>

<Li class = "on"> <a href = "#"> academic direction </a> </LI>

<Li> <a href = "#"> scientific research achievements </a> </LI>

<Li> <a href = "#"> data sharing </a> </LI>

</Ul>

<! -- A class = "more" href = "#"> More + </a --> </div>

<Div class = "BD">

<Div class = "pan">

<Ul class = "list_news">

{Dede: arclist titlelen = '60' typeid = '18' ROW = '6 '}

<Li>

<A href = "[field: arcurl/]"> [field: Title/] </P> </a>

</LI>

{/Dede: arclist}

</Ul>

</Div>

<Div class = "pan" style = "display: none">

<Ul class = "list_news">

{Dede: arclist titlelen = '60' typeid = '7' ROW = '6 '}

<Li>

<A href = "[field: arcurl/]"> [field: Title/] </P> </a>

</LI>

{/Dede: arclist}

</Ul>

</Div>

<Div class = "pan" style = "display: none">

<Ul class = "list_news">

{Dede: arclist titlelen = '60' typeid = '1' ROW = '6 '}

<Li>

<A href = "[field: arcurl/]"> [field: Title/] </P> </a>

</LI>

{/Dede: arclist}

</Ul>

</Div>

</Div>

</Div>

<Div class = "center_col">

<Div class = "HD">

<H3 class = "TTL"> <span> News </span>

<A class = "more" href = "#" style = "visibility: hidden"> More + </a> </div>

<Div class = "BD">

<Ul class = "list_news">

{Dede: arclist titlelen = '60' typeid = '30' ROW = '6 '}

<Li>

<A href = "[field: arcurl/]"> [field: Title/] </P> </a>

</LI>

{/Dede: arclist}

</Ul>

</Div>

</Div>

The general idea is that you only need to replace the typeids in {Dede: arclist titlelen = '60' typeid = '30' ROW = '6, delete information sharing and academic content, and change the name of scientific research results to the latest one. The modified code is as follows:

<Div class = "tabbox">

<Div class = "HD">

<Ul>

<Li class = "on"> <a href = "#"> News </a> </LI>

</Ul>

<! -- A class = "more" href = "#"> More + </a --> </div>

<Div class = "BD">

<Div class = "pan">

<Ul class = "list_news">

{Dede: arclist titlelen = '60' typeid = '30' ROW = '6 '}

<Li>

<A href = "[field: arcurl/]"> [field: Title/] </P> </a>

</LI>

{/Dede: arclist}

</Ul>

</Div>

</Div>

</Div>

<Div class = "center_col">

<Div class = "HD">

<H3 class = "TTL"> <span> latest results </span>

<A class = "more" href = "#" style = "visibility: hidden"> More + </a> </div>

<Div class = "BD">

<Ul class = "list_news">

{Dede: arclist titlelen = '60' typeid = '7' ROW = '6 '}

<Li>

<A href = "[field: arcurl/]"> [field: Title/] </P> </a>

</LI>

{/Dede: arclist}

</Ul>

</Div>

</Div>

Update the home page as follows:

I also want to remove the border, and the background color under the "news" text is not the same as the color next to it. You can also modify the style in index.css.

Search "tabbox" in index.css to get the following code:

. Tabbox {float: Left; width: 384px; padding: 1px 1px 0; Border: 1px solid # CCC ;}
. Tabbox. HD ,. center_col. HD {position: relative; Height: 33px; Background: URL (.. /images/ttl_bg.jpg) Repeat-x Left top; Z-index: 1; line-Height: 33px ;}
. Tabbox. HD. More,. center_col. HD. More {position: absolute; Right: 10px; top: 0; color: #333; text-Decoration: none;

. Tabbox. HD Li {float: Left; width: 88px; font-size: 14px; text-align: center; border-Right: 1px solid # CCC ;}
. Tabbox. HD Li a {color: #333; text-Decoration: none ;}

. Tabbox. HD Li. On {width: pixel PX; Background-color: # FFF; font-weight: bolder ;}

. Tabbox. HD Li. On a {padding-left: 20px; Background: URL (../images/ttl_icon.gif) No-repeat left center ;}
. Tabbox. BD,. center_col. BD {padding: 10px 15px ;}
. List_news Li {Height: 22px; overflow: hidden; padding-left: 10px; Background: URL (.. /images/dot.gif) No-repeat left center; line-Height: 22px ;}
. List_news Li a {color: # 4b4b4b; text-Decoration: none ;}
/**/
. Center_col {float: Left; width: 214px; float: Left; padding: 1px 1px 0; Border: 1px solid # CCC; margin-left: 16px ;}

 

 

 

<Div class = "tabbox">

<Div class = "HD">

<Ul>

<Li class = "on"> <a href = "#"> News </a> </LI>

 

From the code above, I will infer. tabbox. HD Li controls the style of the box that displays "News Dynamics" (length, whether the display font is centered, or something), so the "border-right: 1px "removed ,. tabbox
. HD Li. on controls the style of the text "news and dynamics" (background, font bold, or something), so remove the "background-color: # fff" that controls the background. Removed and updated the home page!