Basic xhtml / css models?

I need to create a very simple site (without dynamic content, 2-column, header and footer), and I have basic knowledge of xhtml / css / php.

That way, I could probably come up with something from scratch, but it probably won't work in all browsers.

I have done several searches, but it’s hard for me to evaluate the quality of the “free templates” advertised everywhere.

So is there any web developer here that has good links or even such models / templates

edit: I looked at Joomla, but it was really too much, so if your answer is CMS, it should be very different from Joomla.

+3
source share
3 answers

-CMS- CSS-. . . , , . YAML ( ) CSS.

+1

, CMS, , - Wordpress. , , .

, .

http://wordpress.org/extend/themes/

+1

:

Faux Columns, , .

, , . HTML HTML- , display CSS , :

<!-- monumental fail -->
<a href="#">
    <div style="height:200px;width:200px;">
        They wanted the anchor to have height/width
        And didn't realize that a `display:block` CSS property
        would allow the anchor element a height/width
    </div>
</a>

CSS float clear, float margin overflow-y. , :

<div style="background:yellow;overflow-y:hidden;">
    <div style="width:100px;float:left;">
        Left Column
    </div>
    <div style="height:500px;margin-left:101px;background:blue;">
        Main Column
    </div>
</div>

... as soon as you realize that you look at the Faux Columns trick , and then you can summarize that into three columns too .

If you then do everything further and start playing with CSS positioning ...

<div style="border:2px solid black;margin:50px;border:2 px solid yellow;height:1500px;width:500px;">
    <div style="height:50px;border:2px solid red;position:absolute;top:0px;">
        Absolute; Top (take note that its parent element is statically positioned...)
    </div>
    <div style="border:2px solid blue;position:relative;left:100px;height:200px;padding-top:50px;">
        Relative; see how it just offset from where it is normally?
        <div style="height:50px;border:2px solid red;position:absolute;top:0px;">
            Absolute; Top (take note that its parent element is NOT statically positioned hence why it not in the same place as the last absolutely positioned div)
        </div>
    </div>
    <div style="height:50px;border:2px solid green;position:fixed;bottom:0px;">
        Fixed; bottom (even there when you scroll)
    </div>
</div>

... then I think you can go from “basic CSS knowledge” to “experienced”.

+1
source

Source: https://habr.com/ru/post/1743647/


All Articles