SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Feb 2014
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Custom tags and tree elements in a page

    Hello all, I want to add custom nodes into my HTML document so I would get the result in the picture. I am a bit confused into how I would do something like this. Can someone explain it to me? Do I need XML for this or some other technologies aside from HTML that I haven't heard of? I know I could do that result with tables, but I want a more clean approach to it and would prefer something like this instead of tables.
    PHP Code:
    <entity type="Person">
        <image><?php //image from db ?></image>
        <first_name><?php //first name from db ?></first_name>
        <last_name><?php //last name from db ?></last_name>
        <gender><?php //gender from db ?></gender>
        <city><?php //city from db ?></city>
        <country><?php //country from db ?></country>
    </entity>
    Attached Images Attached Images

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,467
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by pcristian43 View Post
    Hello all, I want to add custom nodes into my HTML document so I would get the result in the picture. I am a bit confused into how I would do something like this. Can someone explain it to me? Do I need XML for this or some other technologies aside from HTML that I haven't heard of? I know I could do that result with tables, but I want a more clean approach to it and would prefer something like this instead of tables.
    PHP Code:
    <entity type="Person">
        <image><?php //image from db ?></image>
        <first_name><?php //first name from db ?></first_name>
        <last_name><?php //last name from db ?></last_name>
        <gender><?php //gender from db ?></gender>
        <city><?php //city from db ?></city>
        <country><?php //country from db ?></country>
    </entity>
    Hi,

    I'm a little confused as to why you would want to create custom tags especially when you mention you could use tables as there is nothing in common between the two?

    Why not just use normal semantic html ?

    e.g. I would do something like this:

    Code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Untitled Document</title>
    <style>
    dl, dt {
    	margin:0;
    	padding:0;
    }
    .person {
    	width:200px;
    	background:#679966;
    	margin:auto;
    	padding:5px 0 10px;
    	border-radius:4px;
    }
    .person dt span {
    	margin:0 5px 5px;
    	padding:5px;
    	background:#000;
    	color:#fff;
    	display:block;
    	text-align:center;
    	font-weright:bold;
    	border-radius:2px;
    }
    .person dt img {
    	display:block;
    	background:#fff;
    	margin:10px auto;
    }
    .person dd {
    	background:#679966;
    	padding:5px 5px 5px 10px;
    	width:100px;
    	position:relative;
    	border:1px solid #000;
    	color:#fff;
    	font-size:76%;
    	margin:5px 0 5px -50px;
    	border-radius:2px;
    }
    </style>
    </head>
    
    <body>
    <dl class="person">
    		<dt><span>Fred Bloggs</span><img src="person.ing" width="80" height="80" alt="Fred Bloggs"></dt>
    		<dd>First Name</dd>
    		<dd>Last Name</dd>
    		<dd>Male</dd>
    		<dd>London</dd>
    		<dd>UK</dd>
    </dl>
    </body>
    </html>


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •